jQuery蛇形旋转木马效果

Question

我似乎找不到这样的东西，所以我只是想看看是否有人能给我指个方向。

我需要产品像传送带一样滑动/有蛇的效果。

View on JS Fiddle: http://jsfiddle.net/nLgopodt/2/

所需功能的粗略图表附在附件中。

​

Answer 1

我打算只用css来做这件事，但是我不能让:nth-child选择器正常工作。

不管怎样，我更新了你的jsfiddle

• 每列都在一行中。
• even

将列向右浮动

• javascript会将列预置到第一行，并将溢出列级联到下一行
• 如果没有下一行，它将删除溢出元素。

 `.container .row:nth-child(even) .col     {         float: right;     }`

 `var $rows = $('.container .row');     setInterval(function(){         var $col = $('<div class="col new">NEW COL</div>');         $rows.eq(0).prepend($col);         $col.removeClass('new').addClass('animated bounceIn')         $rows.each(function(idx, elem){             var $row = $(elem),                 $cols = $row.children();             if ($cols.length > 4)             {                 var $overflow = $cols.filter(':gt(3)'),                     $nextRow = $rows.eq(idx + 1);                 if ($nextRow.length == 0)                     $overflow.remove();                 else                     $nextRow.prepend($overflow);             }         });     }, 5000);`