逐渐淡化每一个元素
我想find一种方法来加载一个JSON页面来显示我目前的内容。 但是我试图逐个淡化每个元素？ 有谁熟悉一种方式来做到这一点？
每个元素都淡入淡出？
这里是我的代码的一个例子，我正在使用jQuery框架。
代码： http : //pastie.org/343896
那么，你可以设置你的淡入淡出function来触发“下一个”。
$("div#foo").fadeIn("fast",function(){ $("div#bar").fadeIn("fast", function(){ // etc. }); }); 但是一个计时器可能是一个更好的系统，或者是一个可以把它们全部放到一个数组中的函数，然后把它们放在一个数组中，然后在两者之间进行延迟，然后一次一个地将它们放入一个数组中。
假设您有一个span元素的数组：
$("span").each(function(index) { $(this).delay(400*index).fadeIn(300); });
（快速提示：我认为你需要使用jQuery 1.4或更高版本来使用.delay方法）
这将基本上等待一段时间，并淡入每个元素。这是因为你乘以时间等待的元素的指数。 遍历数组时，延迟看起来像这样：
- 延迟400 * 0（没有延迟，只是淡入淡出，这是我们想要的第一个元素）
- 延迟400 * 1
- 延迟400 * 2
- 延迟400 * 3
这使得一个不错的“一个接一个”淡入淡出效果。 它也可以用于slideDown。 希望这可以帮助！
这个怎么样？
jQuery.fn.fadeDelay = function() { delay = 0; return this.each(function() { $(this).delay(delay).fadeIn(350); delay += 50; }); };
我想你会需要这样的东西：
var elementArray = yourAjaxRequestReturningSomethingEdibleByJQuery(); fadeInNextElement(elementArray); function fadeInNextElement(elementArray) { if (elementArray.length > 0) { var element = elementArray.pop(); $(element).fadeIn('normal', function() { fadeInNextElement(elementArray); } } }
警告：我没有testing过，但是即使不起作用，您也应该明白并修正它。
顺便说一下，我不同意使用计时器。 有了计时器，没有任何事情可以保证这些元素一个接一个地淡入淡出，一个元素的淡入只有在前一个元素结束时才会开始。
从理论上讲，它应该可以工作，但是可能会出现某些情况，例如，由于某种原因您的“链”需要停止，或者衰落的animation无法按时完成等。只需使用适当的链接即可。
用setTimeout（）（标准JS函数）检查jQuery fadeIn（ ）。 你可以结帐我在这个网站http://www.realstorage.ca/上做的事情。; 我基本上隐藏并显示它们，所以它可以循环。
