首页 > 代码库 > javascript学习笔记(五)
javascript学习笔记(五)
第一步，实现demo样式
<html><head><meta http-equiv="Content-Type" content="text/html;charset=utf-8" /><title>鼠标移入/移出改变样式</title><style>body{color:#fff;font:12px/1.5 Tahoma;}#div1 {width:150px;height:150px;margin:0 auto;padding:10px;background:blue;border:10px solid #000;cursor:crosshair;}#div1.hover{color:red;background:#f0f0f0;border:10px solid red;}</style></head><body><div id="div1">鼠标移入改变样式，鼠标移出恢复</div></body></html>
第二步，用JS实现功能
<script>window.onload = function (){ var oDiv = document.getElementById("div1"); oDiv.onmouseover = function () { oDiv.className = "hover" }; oDiv.onmouseout = function () { oDiv.className = "" }};</script>
小结：
cursor:crosshair:光标呈现为十字线。
javascript学习笔记(五)
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。