Question

我写了一个简单的jquery滑块，基本上经过了3个div，隐藏了一个然后淡出了下一个等等，使用setInterval()

滑块适用于我的目的，但是当我打开其他标签然后返回页面标签时，所有div都可见，然后它们开始消失并再次开始工作。

这是我的jquery，它位于$(function(){})：

中

    $('#slideshow-next').click(function() {
    pauseSlideshow();
    nextSlide();
});

$('#slideshow-prev').click(function() {
    pauseSlideshow();
    prevSlide();
});

$('#slideshow-pause').click(function(){
    pauseSlideshow();
});

$('#slideshow-play').click(function() {
    playSlideshow();
});

interval = setInterval('nextSlide()', 4000);
});

function playSlideshow() {
    interval = setInterval('nextSlide()', 4000);
    $('#slideshow-play').hide();
    $('#slideshow-pause').show();
    nextSlide();    
}

function pauseSlideshow() {
    interval = clearInterval(interval);
    $('#slideshow-pause').hide();
    $('#slideshow-play').show();
}

function nextSlide() {

    //hide current slide
    $('#slide'+currentSlide).hide();
    // show next slide
    var next = (currentSlide+1)%3;
    $('#slide'+next).fadeIn('slow');
    currentSlide = next;        
}

function prevSlide() {

    //hide current slide
    $('#slide'+currentSlide).hide();
    // show next slide
    var next = (currentSlide-1)%3;
    $('#slide'+next).fadeIn();
    currentSlide = next;
}

Answer 1

我认为你可能会遇到Chrome: timeouts/interval suspended in background tabs?上提到的不同情况，其中指出：

当选项卡处于非活动状态时，每秒最多只调用一次该函数。

因此，您可以对setInterval进行不同的How can I make setInterval also work when a tab is inactive in Chrome?编码，或者检测制表符开关以暂停幻灯片显示并重新启动标签焦点 How to tell if browser/tab is active

此外，Jquery setInterval too fast when coming from another tab可能有用，因为它声明了

Firefox 5+也会在非活动标签中每秒限制一次超时。

浏览器选项卡未激活时，Jquery简单滑块问题

1 个答案: