0

我正在研究一个简单的连续滑块面板。它似乎可以找到,但是滑动时上一个方向会闪烁。我尝试移动 jQuery 操作的顺序,但似乎没有帮助,有什么想法吗?

http://jsfiddle.net/isherwood/FWUSA/3

$(".next").click(function () {
    $('.slides').animate({
        'marginLeft': '-=530px'
    }, function () {
        $('ul.slides li:last').after($('ul.slides li:first'));
        $(".slides").css('marginLeft', 0);
    });
});

$(".prev").click(function () {
    $('.slides').animate({
        'marginLeft': '530px'
    }, function () {
        $('ul.slides li:first').before($('ul.slides li:last'));
        $(".slides").css('marginLeft', 0);
    });
});
4

1 回答 1

0

您将单个类应用于所有图像,并且您的代码适用于该类。

$(".slides").css('marginLeft', 0);

这控制了所有具有幻灯片类的元素。由于您的所有图像都具有该类,因此它们都会立即移动。您需要找到一种方法来区分每个图像。尝试添加一个.next(). http://api.jquery.com/next/

** * ** * *我的意见* ** * ** * **

我相信您正在尝试创建一个 JQuery 滑块?

几周前我沿着这条路走。虽然我有一个最终能正常工作,但它不是很好。需要大量的浏览器解决方法和黑客攻击。我建议使用插件。我正在使用 Flexslider。 http://www.woothemes.com/flexslider/

它可以定制,简单,使用JQuery,轻量级。

于 2013-04-03T02:58:20.603 回答