jQuery中一个元素附近的鼠标功能 [英] Function for mouse near an element in jQuery
本文介绍了jQuery中一个元素附近的鼠标功能的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
当鼠标靠近桌面元素时,我想跟踪并显示工具提示。它适用于 mouseenter
事件,但是当它靠近时,我想在 mouseenter
之前显示工具提示。另外我想在 mouseout
>表格头部的一段距离之后移除工具提示。
I want to track and show a tooltip when the mouse is near a table head element. It works with the mouseenter
event, but I want show the tooltip before mouseenter
, when it gets near. Also I want remove the tooltip after mouseout
some distance from the table head.
这是我的代码。
$('thead').mouseenter(showtooltip);
$('thead').mouseout(removetooltip);
如何使用jQuery来做到这一点?
How can I do this with jQuery?
推荐答案
这有效。第一个参数可以是任何jQuery对象。第二个参数是对象的接近度,在这种情况下 20px
。
This works. The first parameter can be any jQuery object. The second parameter is the nearness to the object, in this case 20px
.
演示:http://jsfiddle.net/ThinkingStiff/Lpg8x/
脚本:
$( 'body' ).mousemove( function( event ) {
if( isNear( $( 'thead' ), 20, event ) ) {
//show your tooltip here
} else {
//hide it here
};
});
function isNear( element, distance, event ) {
var left = element.offset().left - distance,
top = element.offset().top - distance,
right = left + element.width() + 2*distance,
bottom = top + element.height() + 2*distance,
x = event.pageX,
y = event.pageY;
return ( x > left && x < right && y > top && y < bottom );
};
这篇关于jQuery中一个元素附近的鼠标功能的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文