javascript - jQuery .animate() 加速？

Question

在此之前我已经搜索过答案，但就像我遇到的大多数问题一样，我一无所获。 :(

基本上我正在尝试使用基本系统制作自定义 jQuery 图像 slider :

1. 将所有图片路径放入一个数组中。
2. 使用每个数组条目路径预加载所有图像。
3. 使用数组路径 [0], 1 加载 HTML 'img's(左、中、右)和 [2]。
4. 当您点击左键时，所有图像 margin-left 向左移动 100%(右移反之亦然)

这是我的问题；当我单击其中一个导航按钮时，图像移动但速度不同，似乎存在某种我无法关闭的加速因素，这意味着图像移动时存在间隙。

有人知道为什么会发生这种情况以及如何阻止它吗？

我还有一个关于这个的问题，我应该为此单独提出一个问题吗？

这是 Javascript。

 $(document).ready(function(){
var images = [ "http://furrydex.net/img1.png", "http://furrydex.net/img2.png" ];
var loadedImages = [];
var pos = 0;
$.each(images, function( index, value ) {
    var img=new Image();
    img.src=value;
    loadedImages.push(img);
});
if(images[2] == undefined) {
    $('#left').attr('src', images[1]);
    $('#center').attr('src', images[0]);
    $('#right').attr('src', images[1]);
}
$('.navigationLeft').click(function() {
    console.log("yay");
    $( '.slide' ).animate({
        marginLeft: "100%"
    }, 500, "linear",  function() {
        // Animation complete.
    });
});
});

左边的黑色 block 是'left'，你需要测试它。

这是 JSFiddle

Answer 1

好吧，我放了一些东西，让它没有间隙，但我确实认为找到让它以某种方式基于百分比失败的罪魁祸首是正确的技巧。 ;)

var selWidth = $('.selector').width();

$( '.slide' ).animate({
  marginLeft: selWidth
})

JSFIDDLE:http://jsfiddle.net/TRNCFRMCN/RrQ5d/5/