jQuery - “预加载”（setinterval）的效果？

我的代码：jQuery - “预加载”（setinterval）的效果？

jQuery(img).each(function() { 
     jQuery(this).animate({opacity: 0}); 
     jQuery(this).animate({opacity: 1},4000); 
    });

的代码修改图像的不透明度为0，然后到1点是它发生的所有图像，而我希望它在当时一个形象的工作。

任何想法如何实现这一目标？

来源

2011-04-29 Wordpressor

你就可以开始使用显示：无，而不是做动画不透明度0？ – turtlepick 2011-04-29 01:39:11

好吧，这是我在它刺伤。

var duration = 1000; 
$('img').css('opacity', 0).each(function(i) 
{ 
    $(this).delay(i*duration).animate({opacity: 1}, duration); 
});

Demo demo demo

来源

2011-04-29 02:18:09

jQuery('img').css('opacity', 0).each(function(i) { 
    jQuery(this).animate({opacity: 0}, i * 1000); 
    jQuery(this).animate({opacity: 1}, 1000); 
});

http://jsfiddle.net/Squeegy/9J54u/4/

这将在一个图像褪色，每4秒，直到全部褪。

这工作，因为每个数组到你的迭代函数索引通过。并且您可以使用该索引作为淡入之前的偏移量。

来源

2011-04-29 01:41:29

我很确定你想把第一个'.animate（）'调用改成'.css（'opacity'，0）;'。 – 2011-04-29 01:43:21

@Matt Ball，的确你是对的谢谢。 – 2011-04-29 01:44:08

http://jsfiddle.net/userdude/9J54u/1/ – 2011-04-29 01:44:18

下面是如何让每个图像逐渐淡入的示例。当第一个图像完成淡入时，第二个图像开始，依此类推。

$(img).each(function(i) { 
    $(this).css('opacity', 0); 
}); 

doAnim(img, 0); 

function doAnim(items, i) { 
    if (i > items.length) return; 
    $(items[i]).animate({ 
     opacity: 1 
    }, { 
     complete: function() { 
      doAnim(items, i + 1); 
     } 
    }); 
}

Here's a live demo.

来源

2011-04-29 01:57:59 josh3736

jQuery - “预加载”（setinterval）的效果？

回答

相关问题