如何重构这个jQuery Fade效果?

时间:2013-07-30 21:31:34

标签: jquery refactoring

我刚开始编写jQuery并且希望得到一些关于如何重构某些内容的帮助..我正在尝试让元素在页面加载时按顺序淡入淡出。效果很好,但在代码中看起来很笨拙。拥有更多经验的人可以帮我重构一下以提高效率吗?

$('.home h1').delay(100).animate({
    opacity : '1'
}, 'slow');

$('.home h2').delay(250).animate({
    opacity : '1'
}, 'slow') ;

$('.home h3').delay(400).animate({
    opacity : '1'
}, 'slow');

$('.home hr').delay(550).animate({
    opacity : '1'
}, 'slow');

$('.homeimages > img').delay(900).animate({
    opacity : '1'
}, 'slow');


$('.homenav').delay(1000).animate({
    opacity : '1'
}, 'slow');

谢谢!

1 个答案:

答案 0 :(得分:1)

尝试以下方式:

var elements: {
    'selector': 100, // delay
    'selector2': 200 // delay
};

for( var selector in elements ) {
    $(selector).delay( elements[selector] ).animate({
        opacity : '1'
    }, 'slow');
}