JQuery，左錯位置

Question

我有這個代碼：

$(this).closest("p").after('<strong>' + arMess[iCurIndex] + '</strong>').next().animate({
            top: $(this).offset().top - 57,
            left: -$(this).width() //[First value] Here i get 148px on chrome and 150px on firefox

        }, 300,function(){
            alert($(this).offset().top - 57);
            alert(-$(this).width()); //[Second value] Here i get the true width the one i want to present the left
        });

代碼概述： 在第一行我為STRONG元素設置動畫

正如你所看到的，我得到了2個不同的值- $（this）.width（） ：

第一個值：我在動畫過程中得到的。

第二個值：動畫結束后我得到了。

如果有人知道我得到2個不同價值觀的原因，我將非常感激。

Answer 1

嘗試使用outerWidth或檢查元素的css是否float:left

$(this).closest("p").after('<strong>' + arMess[iCurIndex] + '</strong>').next().animate({
            top: $(this).offset().top - 57,
            left: -$(this).outerWidth();
                         // use .outerWidth(true); if you want to 
                         //calculate with margin and border values

}, 300,function(){
            alert($(this).offset().top - 57);
            alert(-$(this).outerWidth());
});

Answer 2

這里的問題是JavaScript的關鍵字，這並不有它，當你設置寬度不被動畫后調用內部函數相同的值。 對於第一個值， 這是觸發動畫的對象。 在警報被稱為這個功能是進行動畫處理的對象。

嘗試這個：

var $strongElement = $(this).closest("p").after('<strong>' + arMess[iCurIndex] + '</strong>').next();

$strongElement.animate({
       top: $(this).offset().top - 57,
       left: -$strongElement.width() 
    }, 300, function(){
    alert(-$(this).width()); 
});

見http://jsfiddle.net/vtyjf/