0

我有这个代码：

$(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元素设置了动画

如您所见，我从-$(this).width()获得了 2 个不同的值：

第一个值：我在动画过程中得到。

第二个值：我在动画完成后得到。

如果有人知道我得到 2 个不同值的原因，我将非常感激。

4

2 回答 2

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());
});
于 2013-04-06T11:15:44.873 回答
1

这里的问题是 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/

于 2013-04-06T14:55:29.167 回答