您当前的位置:首页 > 圈子

onmousemove鼠标事件

2024-10-14 16:54:03 作者:石家庄人才网

石家庄人才网为你带来《onmousemove鼠标事件》,整篇文章对相关内容进行了展开说明深度讲解,希望通过本文您能得到想要了解的知识要点。

onmousemove 事件在鼠标指针移动到指定的元素上时触发。onmousemove 事件类似于 onmouseover 事件。不同之处在于,只要鼠标指针在指定元素内移动,就会发生 onmousemove 事件,而 onmouseover 事件只会在鼠标指针移动到元素区域时触发一次。

语法

在 HTML 中,onmousemove 属性作为事件属性使用,以指定鼠标指针移动到元素上时要执行的 JavaScript 代码:

<element onmousemove="myScript">

在 JavaScript 中,onmousemove 事件通常与 HTML 元素一起使用:

object.onmousemove = function(){myScript};

在 JavaScript 中,onmousemove 事件还可用于 window 对象:

window.onmousemove = function(){myScript};

提示:对于 onmousemove 事件来说,即使鼠标指针在元素内移动时没有移动,也会触发该事件。石家庄人才网小编提示您,这意味着如果光标停留在该元素上,则会每隔几毫秒就触发一次该事件。

实例

如何在鼠标指针移动到某个区域时显示鼠标的 x 和 y 坐标:

<html>
<head>
<script type="text/javascript">
function show_coords(event)
{
x=event.clientX;
y=event.clientY;
document.getElementById("one").innerHTML="X 坐标: " + x + ", Y 坐标: " + y;
}
&l

onmousemove鼠标事件

t;/script>
</head>
<body>

把鼠标指针移动到矩形中:</p>
<di

onmousemove鼠标事件

v onmousemove="show_coords(event)" style="background-color:#e5ccff;height

onmousemove鼠标事件

:200px;width:300px;padding:2px">
<p id="one" style="text-align:center"></p>
</div>
</body>
</html>

浏览器支持

所有主流浏览器都支持 onmousemove 事件。

相关事件

与 onmousemove 事件相关的事件:

  • onmousedown - 当鼠标按钮被按下时触发。
  • onmouseup - 当鼠标按钮被松开时触发。
  • onmouseover - 当鼠标指针移动到元素上时触发。
  • onmouseout - 当鼠标指针移出元素时触发。

石家庄人才网小编对《onmousemove鼠标事件》内容分享到这里,如果有相关疑问请在本站留言。

版权声明:《onmousemove鼠标事件》来自【石家庄人才网】收集整理于网络,不代表本站立场,所有图片文章版权属于原作者,如有侵略,联系删除。
https://www.ymil.cn/quanzi/14350.html