Question

我创建了一个旋转的列表项，但我想引入两个按钮来控制列表。第一个按钮应该基本上让列表项向上移动而第二个底部应该反向，即让列表项向下滑动。

这是我用来旋转列表的代码here

由于

Answer 1

听起来你正试图控制列表轮换的方向。如果是这样，试试这个：

var direction = 'down';

    $(document).ready(function () {
        var swap = function () {
            if (direction == 'down') {
                $("ul li:last").slideUp('slow', function () {
                    $(this).remove();
                    $("ul").prepend($(this));
                    $(this).slideDown('slow', function () {
                        swap();
                    });
                });
            }
            else {
                $("ul li:first").slideDown('slow', function () {
                    $(this).remove();
                    $("ul").append($(this));
                    $(this).slideUp('slow', function () {
                        swap();
                    });
                });
            }
        }
        swap();
    });

然后你需要做的所有按钮都是改变“方向”的值，例如

onclick="direction = 'up';"

Answer 2

split为按钮提供两个类.up和.down并附加事件

working version on fiddle here 或here

$(".up").click(function(){
    $("ul li:first").slideUp('slow', function () {
         $("ul li:last").after($(this));
    }).slideDown('slow');
});

$(".down").click(function(){
    $("ul li:last").slideUp('slow', function () {
         $("ul li:first").before($(this));
    }).slideDown('slow');
});

旋转列表项

2 个答案: