如何重写这个代码(“setTimeout-s”的意大利面)？

Question

请帮我重写这张setTimeout的意大利面

这是一个动画:选定的图像以1秒的间隔突出显示

var $pic_1 = $('.pic-1');
        var $pic_13 = $('.pic-13');
        var $pic_4 = $('.pic-4');
        var $pic_9 = $('.pic-9');
        var $pic_12 = $('.pic-12');
        var $pic_19 = $('.pic-19');
        var $pic_11 = $('.pic-11');
        var $pic_20 = $('.pic-20');

        function blinkImages() {
            $pic_1.css('opacity', 1);
            setTimeout(function() {
                $pic_1.css('opacity',.3);
                $pic_13.css('opacity', 1);
                setTimeout(function() {
                    $pic_13.css('opacity',.3);
                    $pic_4.css('opacity', 1);
                    setTimeout(function() {
                        $pic_4.css('opacity',.3);
                        $pic_20.css('opacity', 1);
                        setTimeout(function() {
                            $pic_20.css('opacity',.3);
                            $pic_9.css('opacity', 1);
                            setTimeout(function() {
                                $pic_9.css('opacity',.3);
                                $pic_12.css('opacity', 1);
                                setTimeout(function() {
                                    $pic_12.css('opacity',.3);
                                    $pic_19.css('opacity', 1);
                                    setTimeout(function() {
                                        $pic_19.css('opacity',.3);
                                        $pic_11.css('opacity',1);
                                        setTimeout(function() {
                                            $pic_11.css('opacity',.3);
                                            blinkImages();
                                        },1000);
                                    },1000);
                                },1000);
                            },1000);
                        },1000);
                    },1000);
                },1000);
            }, 1000);
        }
        blinkImages();

Answer 1

不如像这样

var seq=['.pic_1','.pic_13','.pic_4','.pic_20','.pic_9','.pic_12','.pic_19','.pic_11']
var cur = seq.shift();
$(cur).css('opacity', 1);
setInterval(function() {
    $(cur).css('opacity', 0.3);
    seq.push(cur);
    cur = seq.shift();
    $(cur).css('opacity', 1);
}, 1000);

在第一个循环中可能有一个故障，但是您可能能够用该基本代码解决它。

在我看来，它不应该离你所拥有的不远。