jQuery从上到下依次淡出

jQuery从上到下依次淡出

JS公司:

$(function(){
 chainAnim('.section','slow','1')  });
 function chainAnim(e,s,o) {
        var $fade = $(e);
        var code = "console.log('Done.');";
        $fade.each(function(){
   code = "$('#"+$(this).attr('id')+"').fadeTo('"+s+"','"+o+"',function(){"+code+"});";
        });
        eval(code);
}

HTML格式:
 <div id="wrapper">
  <div class="section" id="section-1">Section 1</div>
  <div class="section" id="section-2">Section 2</div>
  <div class="section" id="section-3">Section 3</div>
  <div class="section" id="section-4">Section 4</div>
 </div>

设置动画时,第4节首先设置动画。我怎样才能逆转?

最佳答案

这应该可以满足您的要求,但我已经删除了您的eval()代码。不知道你为什么这么做。
示例:http://jsfiddle.net/wqWE5/
我还将第二个参数从"slow"更改为800,以便可以在.delay()中使用它。
通过的持续时间乘以.each()的当前索引将使动画按顺序发生。

$(function(){
     chainAnim('.section',800,'1');
});

function chainAnim(e,s,o) {
        var $fade = $(e);
        var code = function() {console.log('Done.');};
        $fade.each(function( i ){
            $(this).delay(i * s).fadeTo(s,o,code);
        });
}

关于jquery - jQuery从上到下依次淡出,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/3662135/

10-11 13:15