Question

我有3个元素（＃hotlink1Div，＃topBarContentid，＃hotlink2Div）将会循环播放。

我设法找到了在线循环的代码。目前他们出现的顺序是：＃topBarContentid，＃hotlink1Div，＃hotlink2Div

我希望看到以下顺序：＃topBarContentid，＃hotlink1Div，＃topBarContentid，＃hotlink2Div，＃topBarContentid。

slideHotlinks: function () {
    console.log(this.px + "Hotlinks started");
    var $elements = $('#hotlink1Div, #topBarContentid, #hotlink2Div');      //List of elements used
    function hotlinks_loop(index) {                         //Function to index elements as their are shown
        console.log(this.px + "Hotlinks loop created");
        $elements.eq(index).slideDown(1000, function() {
            var $self = $(this);
            setTimeout(function() {
                console.log(this.px + "Hotlinks timeout set");
                $self.fadeOut(1000);
                hotlinks_loop((index + 1) % $elements.length);
            },5000);
    });
}
hotlinks_loop(0); // start with the first element

Answer 1

怎么样：

var elements = ['#pointsbarDiv', '#hotlink1Div','#pointsbarDiv', '#hotlink2Div'];

function anim_loop(index) {
    $(elements[index]).slideDown(1000, function() {
        var $self = $(this);
        setTimeout(function() {
            $self.fadeOut(1000);
            anim_loop((index + 1) % elements.length);
        }, 5000);
    });
}

anim_loop(0); // start with the first element

取自原始jsbin的编辑：http://jsbin.com/uwonun/46

这使用javascript数组而不是jquery选择器。数组中的每个条目都转换为anim_loop函数第一行中的jquery对象。

jquery选择器与集合并不完全相同，而是按照它们在页面上显示的顺序遍历页面的dom并返回与其表达式匹配的元素。因此，不可能让选择器返回相同的元素两次。另外，页面中的id应该是唯一的，因此选择器应该只为每个id返回一个元素。

显示循环中元素的顺序

1 个答案: