Javascript 将悬停时暂停添加到jQuery

有人能帮助我在使用这个示例时尝试暂停悬停吗。基本上，我需要它来做以下事情

• 悬停时的暂停间隔
• 突出显示悬停在上方的项目
• 悬停时继续旋转

代码（）：

您可能需要对此进行一些调整，以适应您的需求。基本上，这个想法是在mouse-over上清除interval并在mouseout上恢复递归&保留一个count引用

var $f = $('ul').find('.frame'),
    timeOut, 
    count; 

function recursive(i) {
    count = i;
    $f.removeClass('showing').eq(i).addClass('showing');
    timeOut = setTimeout(function () {
        recursive(++i % $f.length)
    }, 1000);
}

$('ul li').hover(function(){
    clearTimeout(timeOut);
});

$('ul li').mouseout(function(){
    recursive(count);
});


recursive(0);

加上这个

$(".frame").hover(function () {
    clearTimeout(t);
    console.log(this);
    $(this).addClass("showing");
}, function () {
    recursive(0);
});

试试这个：

var $f = $('ul').find('.frame');
$('ul li').hover(function(){
    $f.removeClass('showing');
    $(this).addClass('showing');
    clearTimeout(timer);
}, function(){
    recursive($(this).index());
});

function recursive(i) {
    $f.removeClass('showing').eq(i).addClass('showing');
    timer = setTimeout(function () {
        recursive(++i % $f.length)
    }, 1000);
}

recursive(0);

var $f = $('ul').find('.frame');
$('ul li').hover(function(){
    $f.removeClass('showing');
    $(this).addClass('showing');
    clearTimeout(timer);
}, function(){
    recursive($(this).index());
});

function recursive(i) {
    $f.removeClass('showing').eq(i).addClass('showing');
    timer = setTimeout(function () {
        recursive(++i % $f.length)
    }, 1000);
}

recursive(0);