jQuery setTimeout

Question

我想为这个工具提示代码添加一个超时,所以它只显示鼠标是否在一段时间后悬停在它上面而不是立即...我尝试添加setTimeout()但我无法弄清楚如何使用clearTimeout()所以工具提示没有隐藏在mouseout上.你能帮我吗？

// -----------------------------------------------
// TOOLTIP MOUSE HOVER
// -----------------------------------------------
function mcTooltip() {
    $('.mcTxb').mousemove(function(e) {
        var mcHoverText = $(this).attr('alt');
        var mcTooltip = $('.mcTooltip');
        $(mcTooltip).text(mcHoverText).show('fast');
        $(mcTooltip).css('top', e.clientY + 10).css('left', e.clientX + 10);
    }).mouseout(function() {
        var mcTooltip = $('.mcTooltip');
        $(mcTooltip).hide('fast');
    });
}
mcTooltip();

我试过这个:

    // -----------------------------------------------
// TOOLTIP MOUSE HOVER
// -----------------------------------------------
function mcTooltip() {
    $('.mcTxb').mousemove(function(e) {
        var mcHoverText = $(this).attr('alt');
        var mcTooltip = $('.mcTooltip');
        setTimeOut(function(){
            $(mcTooltip).text(mcHoverText).show('fast');
        }, 300);
        $(mcTooltip).css('top', e.clientY + 10).css('left', e.clientX + 10);
    }).mouseout(function() {
        var mcTooltip = $('.mcTooltip');
        $(mcTooltip).hide('fast');
    });
}
mcTooltip();

Answer 1

当您使用动画时,您可以使用.delay()延迟工具提示的外观:

$(mcTooltip).text(mcHoverText).delay(1000).show('fast');

在您的mouseout函数中,用于.stop取消任何现有的延迟或动画,然后隐藏工具提示:

$(mcTooltip).stop(true).hide('fast');