Question

我正在尝试使用setinterval和jquery创建简单的滑块你可以看看http://jsfiddle.net/5m2Dq/
当滑块专注于浏览器时，滑块可以正常工作，但是当我们在不同的标签上移动超过5分钟时，所有的div都会在彼此之下，并开始切换。

$('#fbLoginSlide div:gt(0)').hide();
setInterval(function(){
   $('#fbLoginSlide :eq(0)').fadeOut('slow').hide()
   .next('div.loginSlide').fadeIn('slow')
   .end().appendTo('#fbLoginSlide');
},2000);

有没有一种简单的方法可以在没有任何插件的情况下实现这样的滑动效果。

Answer 1

这可能是因为您的浏览器开始缺少超时。特别是如果您正在查看另一个选项卡，浏览器认为以恰好2秒的间隔调用回调并不重要。你应该完全抛弃setInterval函数！使用fadeOut和fadeIn的完成回调来触发效果。

尝试类似

的内容

var cycle = function() {
   $('#fbLoginSlide :eq(0)').fadeOut('slow').hide()
   .next('div.loginSlide').fadeIn('slow', function() { setTimeout(cycle, 1500); })
   .end().appendTo('#fbLoginSlide');
};
cycle();

具有奇怪行为的setInterval（）的简单滑块

1 个答案: