jquery - 如何重构这个 jQuery 淡入淡出效果？

Question

我是编写 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');

谢谢！

Answer 1

试试下面的方法：

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

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