jQuery 设置超时

Question

我想为此工具提示代码添加一个超时，这样它仅在鼠标悬停在其上一段时间后而不是立即显示...我尝试添加 setTimeout() 但我无法弄清楚如何使用 clearTimeout() 因此工具提示不会在鼠标移开时隐藏。你能帮忙吗？

// -----------------------------------------------
// 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');