jQuery的整个屏幕

问题描述:

动画如何可以动画一个div通过了与单一的点击屏幕使用jQueryjQuery的整个屏幕

我假设你想在屏幕上的DIV从一个位置移动到另一个。做到这一点的方法是链接几个animate()调用,在前一步完成时将它从一个位置移动到另一个位置。也许将中间位置(如果有的话)存储在一个数组中,然后从每个有效呼叫的下一个位置弹出,直到所有呼叫都完成。使用递归回调函数可能是处理这个问题的最好方法。

我假设DIV已经绝对定位了。如果没有,你可能想看看makeAbsolute插件。

未经检验

var positions = [ [ x1, y1 ], [ x2, y2 ], .. ]; 

play($('#myDiv'), positions); 


function play(elem, positions) { 
    if (positions.length > 0) { 
     var position = positions.shift(); 
     elem.animate({ left: position[0], top: position[1] } }, function() { 
      play(elem, positions); 
     }); 
    } 
} 

$("#myDiv").click(
    function(event){ 
     $(this).animate({"left:0"},1500,'linear' // the fourth parameter is a callback function which runs when the animation completes 
      function(){ $(this).animate(...); 
    } 
); 

由于tvanfosson说的,这只是一系列调用animate函数的 - 上面的代码是不完全理想的你在说什么,但它足够清楚地说明了这个例子(我认为)。