jQuery 中鼠标靠近元素的函数

发布于 2024-12-12 01:37:43 字数 310 浏览 0 评论 0原文

我想在鼠标靠近表格头元素时跟踪并显示工具提示。它与 mouseenter 事件配合使用，但我想在 mouseenter 靠近时在它之前显示工具提示。另外，我想在鼠标移出距离表头一定距离后删除工具提示。

这是我的代码：

$('thead').mouseenter(showtooltip);
$('thead').mouseout(removetooltip);

我怎样才能用 jQuery 做到这一点？

原文

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.

This is my code:

$('thead').mouseenter(showtooltip);
$('thead').mouseout(removetooltip);

How can I do this with jQuery?

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

以为你会在 2024-12-19 01:37:43

这有效。第一个参数可以是任何 jQuery 对象。第二个参数是与对象的接近度，在本例中为 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 );

};

This works. The first parameter can be any jQuery object. The second parameter is the nearness to the object, in this case 20px.

Demo: http://jsfiddle.net/ThinkingStiff/Lpg8x/

Script:

$( '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 );

};

回复收藏 0 原文

~没有更多了~