Question

我有以下jquery代码在#test div中按顺序淡入几个图像：

$("#test img").each(function(index) {
    $(this).delay(500*index).fadeIn(1000);
});

这很有效。在剧本中，我有以下内容：

$('#test img#img1').delay(5000).fadeOut(1000);
$('#main-content').delay(5000).fadeIn(1000);
$('#menu').delay(5000).fadeIn(1000);
$('#test img#img2').delay(5500).fadeOut(1000);
$('#test img#img3').delay(5500).fadeOut(1000);

这个第二系列的淡入淡出在IE7上运行得很好。在IE7上，第二组代码同时发生，没有任何延迟。

我的问题是，如何将第二套重写为第一套简单的东西？我有点希望通过这样做，它可以在IE7上正常工作。我尝试了类似下面的内容，但它没有用......

$("#test img").each(function(index) {
    $(this).delay(500*index).fadeIn(1000, function() {
        $('#test img#img1').delay(5000).fadeOut(1000, function() {
            $('#main-content').delay(500).fadeIn(1000, function() {
                $('#menu').delay(500).fadeIn(1000, function() {
                    $('#test img#img2').delay(500).fadeOut(1000, function() {
                        $('#test img#img3').delay(500).fadeOut(1000);
                    });
                });
            });
        });
    });
});

有什么想法？谢谢你的时间！

Answer 1

就像第一个，只是使用不同的选择器：

$("#img1, #main-content, #menu, #img2, #img3").each(function(index) {
    $(this).delay(500 * index).fadeOut(1000);
});

注意：id选择器（id）内无需使用'#test img#img1'。
无论如何，ID都是唯一的，只需使用'#img1'。

jQuery延迟淡化重写代码

1 个答案: