jquery - 无法获取左侧属性值以在动画方法中执行

Question

我有一个带有一些缩略图图像的轮播，当用户单击一个时，它假设向左淡出较大的图像，然后使用新图像从左侧淡入。我相信我的语法是正确的，它按预期淡入淡出，但不是我想要的左边。下面是点击事件的 jQuery。

// click event handler for the <a> elements
$("#image_list a").click(function(evt) {
    var lgURL = $(this).attr("href");
    $("#image").animate({ opacity: 0, left: -205 }, 1000,
        function () {
            $("#image").attr("src", lgURL);
            $(this).animate({ opacity: 1, left: "+=205" }, 1000)
        }
    ); //end animate

    evt.preventDefault();
}); //end click

Answer 1

尝试使用左侧的数字值而不是字符串。

既然要加205，为什么不把左边设为0呢？

$(this).animate({ opacity: 1, left: 0 }, 1000)

Answer 2

效果没有发生的原因是我没有指定相对于元素的位置。在我更新了我的 CSS 之后，它的动画效果会向左淡入，然后从左侧返回就像一个魅力。

#image {
position: relative;
height: 250px;
margin-bottom: 1em; 
margin-left: 105px;
}