jquery animating throughout screen
how can i animate a div through out screen with single click with jquery
I'm assuming that you want to move the DIV around the screen from one position to another. The way to do this would be to chain several animate() calls moving it from one position to another as the previous move completes. Perhaps store the intermediate positions, if you have them, in an array and pop off the next position for each animate call until all the calls are completed. Using a recursive callback function would probably be the best way to handle this.
I'll assume that the DIV is already absolutely positioned. If not, you might want to have a look at the makeAbsolute plugin.
untested
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(...);
}
);
As tvanfosson was saying, it's just a series of calls to the animate function - the above code isn't exactly ideal for what you're talking about, but it illustrates the example clearly enough (I think).
精彩评论