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关键字 this 在动画之后调用的内部函数中没有与设置宽度时相同的值。对于第一个值，此是触发动画的对象。在名为的警报的函数中，此是正在设置动画的对象。

试试这个：

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/

JQuery，左错位置

2 个答案: