与jQuery动画 - offset.left不更新

Question

我试图直到它到达其目标在动画在屏幕上的几个步骤的对象。然而，offset.left值不是动态变化（或者说我这样做是错误的可能性较大）。

这里就是我有

var initialOffset = $('#puzzle-transition-object').offset(); //thing to move 
var terminalOffset = $('#puzzle-container').offset(); //thing to touch 
var dtt = terminalOffset.left - initialOffset.left; //distance to travel 
var stepSegment = "+=" + Math.ceil(dtt/8) + "px"; //in left: css format 

function bringOutTheDiv(){ 
    var currentDivPosition = $('#puzzle-transition-object').offset(); 
    if(currentDivPosition.left < terminalOffset.left){ 
    console.log("current position"+currentDivPosition.left+": "+terminalOffset.left); 
    takeAStep(); 
    } 
} 

function takeAStep(){ 
    $('#puzzle-transition-object').animate({ 
     left: stepSegment, 
    }, { 
     duration: 50, 
     complete: function() { 
     //console.log("completed a step"); 
     } 
    }); 
    bringOutTheDiv(); 
} 

我确实有它在一个while循环，但爆发出来到另一个函数。基本上，currentDivPosition.left没有更新，我得到一个堆栈溢出错误，但在div确实在屏幕上移动所有的方式...

的感谢！

Answer 1

看起来你应该这样做：

var initialOffset = $('#puzzle-transition-object').offset(); //thing to move 
var terminalOffset = $('#puzzle-container').offset(); //thing to touch 
var dtt = terminalOffset.left - initialOffset.left; //distance to travel 
var stepSegment = "+=" + Math.ceil(dtt/8) + "px"; //in left: css format 

function bringOutTheDiv(){ 
    var currentDivPosition = $('#puzzle-transition-object').offset(); 
    if(currentDivPosition.left < terminalOffset.left){ 
    console.log("current position"+currentDivPosition.left+": "+terminalOffset.left); 
    takeAStep(); 
    } 
} 

function takeAStep(){ 
    $('#puzzle-transition-object').animate({ 
     left: stepSegment, 
    }, { 
     duration: 50, 
     complete: function() { 
     //console.log("completed a step"); 
     bringOutTheDiv(); 
     } 
    }); 
} 

把你电话环内的回电话 - 应该帮助:)