JQuery旋转列表

时间:2012-06-09 00:36:47

标签: javascript jquery rotation

我正在尝试在表格中旋转项目列表(即:)。我要做的是删除第一个项目并在表格末尾添加一个项目。我能够把第一个项目移除但是我坚持我每10秒钟可以不断重做一次。也许,查看代码会给出一个更好的主意。

代码:

        $num_ads = 0;
        if (isset($ads[0])) {
            foreach($ads as $row) {
                                    ...
                                    ...
                echo '<td class="featured_ads_td" id="featured_'.$num_ads.'">';
                                    ...
                                    ...
                                    $num_ads++
                            }
                    }

所以我所做的就是我给表中的每个项目一个唯一的ID。在这种情况下,第一项将是featured_0,然后是featured_1,featured_2..etc

的Javascript

<script src="/jquery-latest.min.js"></script>
<script type="text/javascript">
        var ad_refresh = setInterval(function(){
            $('#featured_0').fadeOut('slow');
            $('#featured_0').attr('id','removed');
        }2000);
</script>

使用下面的脚本将删除我的第一个项目。但是无论如何我可以如何制作第一项feature_0所以我可以每2秒递归一次?或者,如果有更好的方法,请告诉我。我对javascript和jquery的了解仍然非常有限。

感谢您的帮助。

2 个答案:

答案 0 :(得分:1)

如果我确实理解了你的问题,那么沿着这条线的东西将允许你淡出元素并将它放在剩下的元素之后:

请参阅此working Fiddle示例!

<强>的jQuery

var ad_refresh = setInterval(function(){
    var $target = $('.featured_ads_td:first-child');
    $target.fadeOut('slow', function() {
        $target.appendTo('tr').show();
    });
},2000);

答案 1 :(得分:1)

@ Lawrence,你可以这样做:http://jsfiddle.net/estevao_lucas/usXba/

我唯一做的就是克隆并删除第一个元素,然后再次追加到表中。