jQuery推荐推子无法正常工作 [英] Jquery Testimonial fader does not work smoothly

问题描述

我使用淡入淡出效果使用jquery一次旋转div，但效果不流畅 它会跳来跳去然后显示 这是我的小提琴.

I use jquery to rotate my div one by one using fade effect but the effect is not smooth it jumps up and down and then display here is my fiddle.

http://jsfiddle.net/xXRwA/

$(document).ready(function(e) {

  $('.testimonials div:first').show();


    setInterval(function(){ $('.testimonials div:first-child').fadeOut().next('div').fadeIn().end().appendTo('.testimonials') },3000);
});

推荐答案

使用回调函数:

setInterval(function(){ 
   $('.testimonials div:first-child').fadeOut(function() {
        $(this).next('div').fadeIn().end().appendTo('.testimonials');
   }); 
},3000);

http://jsfiddle.net/xXRwA/3/

请注意，您还可以缓存对象并根据元素的索引显示/隐藏元素.这比查询DOM并创建许多jQuery对象要高效(如果需要的话).像此.

Note that you can also cache the object and show/hide the elements based on their indexes. This can be more efficient(if it matters) than querying the DOM and creating many jQuery objects which is not necessary here. Something like this.

这篇关于jQuery推荐推子无法正常工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！