javascript 动画后将元素移回其原始位置，jQuery
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/9216123/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Moving an element back to its original position after animation, jQuery
提问by David
I'm struggling with trying to get this piece of code working properly. I'm moving an element with
我正在努力使这段代码正常工作。我正在移动一个元素
$("#element").hide("slide", { direction: "right" }, 200);
Which works just great, but I need to reset it back to the original position before the animation, once the animation is complete so that it will animate again next time.
这很好用，但我需要将它重置回动画之前的原始位置，一旦动画完成，它就会在下次再次动画。
Any help on this would be greatly appreciated.
对此的任何帮助将不胜感激。
var position = jQuery("#"+that.currentIconSlide).find('.slideInner').position();
jQuery("#"+that.currentIconSlide).find(".slideInner").hide("slide", { direction: "right" }, 200, function(){
jQuery(this).css({"left":position.left,"top":position.top}).parent().hide();
});
JS Fiddle - http://jsfiddle.net/zalun/E4mz9/
JS小提琴 - http://jsfiddle.net/zalun/E4mz9/
回答by Timothy Aaron
$("#element").animate({'left':'300','opacity':'0'}, 2000, function(){
$(this).css({'left':'0','opacity':'1'});
});
回答by Niet the Dark Absol
What I would do is not use jQuery - I would use plain JavaScript, like this:
我会做的不是使用 jQuery - 我会使用纯 JavaScript，如下所示：
elem.style.position = "relative";
// animate by adjusting `left` and `top` relative to the start position
elem.style.position = "static"; // jump back to start position.
Things are a lot easier in plain JS ;)
在普通 JS 中事情要容易得多；)
回答by James Lin
just writing code off my mind, might not execute, but you get the idea
只是在我的脑海里写代码，可能不会执行，但你明白了
var position = jQuery("#"+that.currentIconSlide).find('.slideInner').position();
function slide(){
var original_position = 0;
jQuery("#"+that.currentIconSlide).find(".slideInner").hide("slide", { direction: "right" }, 200, function(){
jQuery(this).css({"left":position.left,"top":position.top}).parent().hide(); //? what is this for?
jQuery(this).css("left":original_position); //set back to original left
slide(); //run again
});
}
