使用jquery的滑块分页

Question

我正在尝试创建一个有分页的滑块。
例如，在我制作的这个 jsfiddle 中

http://jsfiddle.net/ALtW9/

这是我迄今为止尝试过的

$('#a1').click(function () {
   $('#slider ul').animate({
            left: 0
        }, 200, function () {
            $('#slider ul li:first-child').appendTo('#slider ul');
            $('#slider ul').css('left', '');
        });
});


$('#a2').click(function () {
    $('#slider ul').animate({
            left: + slideWidth
        }, 200, function () {
            $('#slider ul li:first-child').appendTo('#slider ul');
            $('#slider ul').css('left', '');
        });
});

顶部有一个 1, 2 ,3 表示数字。 当我单击 3 时，它将动画移动到第 3 个 div。当我单击第一个时，它将移至第一个，依此类推。

当前脚本仅移动到下一个和上一个。对此有什么想法吗？

Answer 1

尝试使用 NivoSlider。您可以在设置中将分页替换为数字

Nivo slider

Answer 2

我强烈推荐使用 bxslider (http://bxslider.com)。它是高度可定制的，可以让您执行上述操作。