I'm facing an issue with constantly scrolling objects on the screen, each assigned a number. When you press one of their numbers, it should move far left off the screen and then scroll back on. However, when I try to reassign the position of the element using offset, it only disappears for a moment and then continues scrolling where it was before. It seems like the animate() function is still running while I attempt to change it, causing it to briefly shift positions before being taken back by the animation. How can I override the animate function when it is called from a different function?
Below is the code segment where I manually assign the position:
$(document).ready(function(){
$(document).keyup(function(e){
if(e.which == 48){
$('#foo').offset({top:8, left:-600});
}
});
});
And here's the animation function in action:
$(document).ready(function(){
setInterval(function(){
$('#foo').animate({
left : "+=10"
},{ duration: 200, queue: false });
},200);
}