jQuery position().left，offsetLeft在chrome和firefox中返回了截然不同的值

Question

为简化起见进行了更新：http://jsfiddle.net/vJVcf/5/

///

http://jsfiddle.net/kE6TR/

（悬停在段落上时发生动画）

我不知道是什么原因导致了这种情况，但我已经将差异缩小到了position（）.left；由于某些原因，webkit和firefox对它的解释完全不同。

var $plugin = jQuery.sub();
$plugin.fn.animate = function(props, speed, cb) {

    if (typeof(speed) == "function") cb = speed, speed = 500;
    if (typeof(cb) != "function") cb = function() {};
    return $.each(this, function(i, el) {
        el = $(el);
        if (props.float && props.float != el.css("float")) {
            var elem = el.clone().insertBefore(el).addClass('killme'),
            temp = el.position().left;
            el.css('position', 'absolute');
            props.marginLeft = 0;
            props.left = 0;
            el.css({
                marginLeft: temp
            });
        }
        $(this).animate(props, speed, function() {
            $(this).css(props);
            cb();
            el.css({
                marginLeft: -100,
                position: "relative",
                display: "block",
                clear: "both"
            });
        });
    });
};

Answer 1

我想我明白你想要的，但你的jQuery看起来不必要地复杂。。。把它换成这个怎么样？（例如。http://jsfiddle.net/tcloninger/uGNzA/)

$(document).ready( function(){
    $('.eula_animate').each( function(){
        $(this)
            .clone()
            .prependTo(this)
            .addClass('move_me')
            .css({'left': $(this).offset().left });
    });
    $('p').hover( function(){
        $('.move_me').show().animate({'left':20},2000);
    });
});

哦，是的，并添加这个CSS:.move_me{ display:none; position:absolute; color:red; }