jQuery mousemove()的使用说明
摘要：当鼠标指针在指定的元素中移动时，就会发生 mousemove 事件。 注意：用户把鼠标移动一个像素，就会发生一次 mousemove 事件。处理所有 mousemove 事件会耗费系统资源。请谨慎使用该事件。
当鼠标指针在指定的元素中移动时，就会发生 mousemove 事件。
注意：用户把鼠标移动一个像素，就会发生一次 mousemove 事件。处理所有 mousemove 事件会耗费系统资源。请谨慎使用该事件。
HTML:
<p>鼠标位于坐标： <span></span>.</p>
Js:
$(document).mousemove(function(e){
$("span").text(e.pageX + ", " + e.pageY);
});
<script type="text/javascript">
function isMouseLeaveOrEnter(e, handler) {
if (e.type != 'mouseout' && e.type != 'mouseover') return false;
var reltg = e.relatedTarget ? e.relatedTarget : e.type == 'mouseout' ? e.toElement : e.fromElement;
while (reltg && reltg != handler)
reltg = reltg.parentNode;
return (reltg != handler);
}
$(function(){
$('#nav li').mouseover(function(){
if (isMouseLeaveOrEnter(event, this)){
$(this).children('ul').slideDown();
}
}).mouseout(function(){
if (isMouseLeaveOrEnter(event, this)){
$(this).children('ul').stop(true,true).hide();
}
});
});
</script>
如有问题，欢迎探讨啊！
注意：用户把鼠标移动一个像素，就会发生一次 mousemove 事件。处理所有 mousemove 事件会耗费系统资源。请谨慎使用该事件。
HTML:
<p>鼠标位于坐标： <span></span>.</p>
Js:
$(document).mousemove(function(e){
$("span").text(e.pageX + ", " + e.pageY);
});
效果如下截图：
总结：
mouseout(),mouseover()这两个事件在使用的时候需要谨慎，会产生事件冒泡，给我们在做一些效果的时候带来不变。
在写多级滑动菜单时可以体验一下mouseenter/mouseleave和mouseover/mouseout的区别，主要是mouse进入子元素时父元素的事件触发的区别。下面的例子你可以把mouseenter/mouseleave替换成mouseover/mouseout，你就能看出它们之间的差异了！
<script type="text/javascript">
function isMouseLeaveOrEnter(e, handler) {
if (e.type != 'mouseout' && e.type != 'mouseover') return false;
var reltg = e.relatedTarget ? e.relatedTarget : e.type == 'mouseout' ? e.toElement : e.fromElement;
while (reltg && reltg != handler)
reltg = reltg.parentNode;
return (reltg != handler);
}
$(function(){
$('#nav li').mouseover(function(){
if (isMouseLeaveOrEnter(event, this)){
$(this).children('ul').slideDown();
}
}).mouseout(function(){
if (isMouseLeaveOrEnter(event, this)){
$(this).children('ul').stop(true,true).hide();
}
});
});
</script>
如有问题，欢迎探讨啊！
