Zepto animate callback not animating

cynikal

New Member
I'm attempting to make something similar to github's project viewer where after clicking a link the box moves to the left out of scene and then another box moves in from the right.The way I attempted to do this is to have just a single div that's animated, and when you click the link the div moves to the left off the screen. Then in the callback of the first animate(), I call .css to move it to the right side of the page (without animating, so it just jumps there) then animate it again to move it back into view from the right. Here's the JS\[code\]$('.mLink').on('click', function(e) { var marginR = $('#mover').css('margin-right'), marginL = $('#mover').css('margin-left'); $('#mover').animate({ 'margin-left': '-1500px', 'margin-right': '1500px' }, 500, 'ease-out', function() { $('#mover').css({ 'margin-left': '1500px', 'margin-right': '-1500px' }); $('#mover').animate({ 'margin-left': marginL, 'margin-right': marginR }, 500, 'ease-in'); });});\[/code\]So what happens is that it animates to the left of the screen then jumps to the right side correctly but then appears in the proper location without actually doing the animation. I'm curious why this is occurring because it means animate() is executing just not showing the animation?EDIT: for clarification
 
Top