演示：jsFiddle

Question

我使用jquery ui创建工具提示并正常工作。我将菜单添加到悬停功能中。但如果我的鼠标光标在标题工具提示上，它就会关闭。

<script type="text/javascript">
    $(function(){
        $(".menu li div.altBurcT ul.altBurc li a").each(function(){
            $(this).tooltip({
                show: null,
                //track: true,
                position: {
                    my: "left top",
                    at: "left bottom"
                },
                open: function(event,ui){
                    ui.tooltip.animate({
                        top: ui.tooltip.position().top + 10
                    }, "slow");
                }
            });
        });

        $(".altBurcT").hide();
        $(".menu li.burc").hover(function(){
            $(this).find("> .altBurcT").stop(true,true).slideDown('slow'/*, 'easeOutBounce'*/);
        },function(){
            $(this).find("> .altBurcT").stop(true,true).hide();
        });
    });
</script>

我们如何解决这个问题？

感谢您的关注。好作品..

追加：

演示：jsfiddle.net/C7StJ

我添加了这是代码，现在没有关闭但是如果我的鼠标出来了，不要关闭它：）

$(".menu li.burc").hover(function(){
    $(this).find("> .altBurcT").stop(true,true).slideDown('slow'/*, 'easeOutBounce'*/);
},function(){
    $(".altBurc li a").each(function(){
        if($(this).attr("aria-describedby").length < 1){
            $(this).find("> .altBurcT").stop(true,true).hide();
        }
    });
});

Answer 1

在你的情况下悬停后，在你的mouseleave或回调上。检查.ui-tooltip是否存在，如果存在，请不要隐藏菜单。

$(".menu li.burc").on('mouseover', function() {
    $(this).find("> .altBurcT").stop(true,true).slideDown('slow'/*, 'easeOutBounce'*/);
}).on('mouseleave', function() {
    if(!($('.ui-tooltip').length > 0))
        $(this).find("> .altBurcT").stop(true,true).hide();
});

jQuery UI＆amp; jQuery悬停在标题工具提示下

1 个答案:

演示：jsFiddle