javascript - 滑块中的.css()方法不起作用

'use strict';
$(function () {
    var currentSlide = 1;

    //DOM cache
    var $slider = $('#slider');
    var $slidesContainer = $slider.find('#container');
    var $slides = $slidesContainer.find("li")
    console.log($slides.length);


    //slider
    setInterval(slide, 3000);

    function slide() {
        $slidesContainer.animate({'margin-left': '-='+400}, 800);
        console.log(currentSlide);
        currentSlide++;
        if (currentSlide === $slides.length) {
            currentSlide = 1;
            $slidesContainer.css("margin-left", 0);// <------PROBLEM HERE
        }//end if
    }//end slide
});//end js

这个滑块几乎不错，但是我不知道为什么.css（）方法不起作用。如果正在工作，因为变量currentSlide等于4（$ slides.length）时将变为1。

感谢所有答案。

最佳答案

您应该等待动画完成，使用其回调方法。

$slidesContainer.animate({
    'margin-left': '-=' + 400
}, 800, function() {
    // Animation complete.
    currentSlide++;
    if (currentSlide === $slides.length) {
        currentSlide = 1;
        $slidesContainer.css("margin-left", 0);
    }
});

关于javascript - 滑块中的.css()方法不起作用，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/41217435/