jquery - 如何使项目的标题消失

Question

我正在使用 jquery 的工具提示来显示和项目的标题：

<a href="#" title="Delete" class="show-option" />

和 JS：

$(function() {
$( ".show-option" ).tooltip({
    show: {
    effect: "slideDown",
    delay: 300
    }
});
});

问题是只要光标悬停在项目上，就会显示标题。但我想要的是一个在光标在项目上方 3 秒后消失的标题。

我一直在寻找一些解决方案，但没有任何效果，希望这是可能的。

Answer 1

尝试

$(function() {
    $( ".show-option" ).tooltip({
        show: {
            effect: "slideDown",
            delay: 300
        },
        open: function( event, ui ) {
            var timer = setTimeout($.proxy(function(){
                $(this).tooltip( "close" );
            },this), 3000);
            $(this).data('hidetimer', timer)
        },
        close: function( event, ui ) {
            clearTimeout($(this).data('hidetimer'))
        }
    });
});

演示：小提琴

Answer 2

$( ".show-option" ).mouseover(function() {
   $( ".show-option" ).fadeOut('slow', function() {
     // Animation complete.
  }, 3000);
});

还没有测试它，但应该给你你需要的。

Answer 3

你可以尝试这样的事情：

$( ".show-option" ).on('mouseover', function() { var that = this; setTimeout(function(){ $(that).tooltip( "close" ); }, 3000); });

这里有一个工作示例：http: //jsfiddle.net/juaning/J9LSd/1/

PS：猜你是用jqueryui