无法获取左侧属性值以在animate方法中执行

Question

我有一个带有一些缩略图的旋转木马，当用户点击其中一个时，它会向左淡出一个较大的图像，然后用新图像从左侧淡入。我相信我的语法是正确的，它会像预期的那样淡入淡出，但不是我想要的左边。下面是click事件的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;
}