如何通过 jQuery 保持鼠标悬停的 DIV 可见?

发布于 2024-11-08 08:00:09 字数 1625 浏览 9 评论 0原文

好吧..问题有点复杂。当您将鼠标悬停在 TR 上时,我会出现一个 DIV。

$(".alignment_tr").hover( function() {
    console.log( "alignmententer" + triggerMouseover );
        var tid = $(this).find( ".hidden_inp_selected_alignment" ).val();
        var element = $(this);

        if( ! element.hasClass( "mouseover-tooltip" ) )
        {
            $.ajax( {
                url: Drupal.settings.jstools.basePath + "?q=search/mouseover_info",
                dataType: 'json',
                data: { "tid": tid },
                success: function( response ) {
                        $(".mouseover-tooltip .top-level").html( response.genre );
                        $(".mouseover-tooltip .second-level").html( response.name );
                        $(".mouseover-tooltip .description").html( response.description );
                        $(".mouseover-tooltip").css( {
                            left: element.position().left + ( element.width() * 0.75 ),
                            top: element.position().top - element.height() / 2,
                        } );
                        if( $(".mouseover-tooltip").css( "display" ) == "none" )
                        {
                            $(".mouseover-tooltip").fadeIn();
                        }
                    }
                });
        }
    },
    function() {
    console.log( "alignmentleave" + triggerMouseover );
        setTimeout( fadeMouseover, 5000 );
    }
);

我试图让它当你将鼠标悬停在 DIV 上时,它不会消失。有什么建议吗?

澄清 现在,当您将鼠标悬停在 TD 上时,就会出现 DIV。我对其进行了操纵,以便当您将鼠标悬停在 DIV 上时,它会保持不变(过去会消失)。但现在当鼠标离开 TR 并离开 DIV 时,DIV 不会消失。

Okay.. a bit complicated of a question. I have a DIV that appears when you mouseover a TR.

$(".alignment_tr").hover( function() {
    console.log( "alignmententer" + triggerMouseover );
        var tid = $(this).find( ".hidden_inp_selected_alignment" ).val();
        var element = $(this);

        if( ! element.hasClass( "mouseover-tooltip" ) )
        {
            $.ajax( {
                url: Drupal.settings.jstools.basePath + "?q=search/mouseover_info",
                dataType: 'json',
                data: { "tid": tid },
                success: function( response ) {
                        $(".mouseover-tooltip .top-level").html( response.genre );
                        $(".mouseover-tooltip .second-level").html( response.name );
                        $(".mouseover-tooltip .description").html( response.description );
                        $(".mouseover-tooltip").css( {
                            left: element.position().left + ( element.width() * 0.75 ),
                            top: element.position().top - element.height() / 2,
                        } );
                        if( $(".mouseover-tooltip").css( "display" ) == "none" )
                        {
                            $(".mouseover-tooltip").fadeIn();
                        }
                    }
                });
        }
    },
    function() {
    console.log( "alignmentleave" + triggerMouseover );
        setTimeout( fadeMouseover, 5000 );
    }
);

I'm trying to get it so that when you mouse over the DIV, it doesn't just disappear. Any tips?

CLARIFICATION
Right now, when you mouseover the TD, the DIV appears. I rigged it so that when you mouseover the DIV, it stays (used to disappear). But now the DIV doesn't disappear when your mouse leaves the TR AND leaves the DIV.

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

扫码二维码加入Web技术交流群

发布评论

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

评论(1

泪痕残 2024-11-15 08:00:10

如果 div 是绝对定位的(我相信确实如此),请将其放置在 tr 中。这样,您的鼠标悬停在 div 上也将被视为悬停在 td 上。这样,您的鼠标悬停在 divtr 上就不会触发 mouseleave

小提琴:

http://jsfiddle.net/mHCNj/1/

If the div is absolutely positioned, which I believe it is, place it within the tr. In that way, your mouse being over the div will count as it being over the td as well. That way your mouse being over the div or the tr will not trigger mouseleave.

A fiddle:

http://jsfiddle.net/mHCNj/1/

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文