Question

我努力让这段代码正常工作。我用

移动元素

$("#element").hide("slide", { direction: "right" }, 200);

哪个效果很好，但是我需要在动画完成之前将其重置回原始位置，一旦动画完成，它将在下次再次设置动画。

对此的任何帮助将不胜感激。

        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小提琴 - http://jsfiddle.net/zalun/E4mz9/

Answer 1

$("#element").animate({'left':'300','opacity':'0'}, 2000, function(){

    $(this).css({'left':'0','opacity':'1'});

});

Answer 2

我要做的不是使用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.

简单JS中的事情要容易得多;）

Answer 3

只是在我脑海中编写代码，可能无法执行，但你明白了

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
        });
}

在动画jQuery之后将元素移回原始位置

3 个答案: