0

我有一个包含很多事件的 div。我尝试了两件事:

1- 使用条件进行切换的第二部分。它有效,但响应并不完美,有一秒钟的延迟。我在这里简化了案例:http: //jsfiddle.net/T26vF/2/

2-然后我尝试了一个简单的切换。当我单击一个对象时,它可以正常工作。但是这里的问题是,当我在切换的第一部分并单击背景或另一个对象并返回到第一个对象时,我必须单击两次,(第一次单击仍然执行第二部分的切换)。我在这里简化了案例:http: //jsfiddle.net/T26vF/4/

$(function(){

    // THIS
    $(".arrodonit").toggle(
        function(){ $(this).children("img").animate({"width":"411px","marginLeft": "-85px","marginTop": "-80px"}, 900); 
                    $(this).siblings(".fons").fadeOut("slow");
                  },

        function(){ $(this).children("img").animate({"width":"233px","marginLeft": "0px","marginTop": "0px"}, 900); 
                    $(this).siblings(".fons").fadeIn("slow");
        }
    );

    // NOT THIS
    $(".arrodonit").click(function(e) {
        e.stopPropagation();
        $('.arrodonit').not(this).siblings(".fons").fadeIn("slow");
        $('.arrodonit').not(this).children("img").stop().animate({ "width":"233px","marginLeft": "0px","marginTop": "0px",}, 900);
        $(".mesInfo").fadeIn()
        $(".info").fadeOut()
    });

    // DOCUMENT
    $(document).click(function() {
       $('.fons').fadeIn();
       $('.arrodonit img').animate({ "width":"233px","marginLeft": "0px","marginTop": "0px"}, 900); 
    });

})

我问:
- 我的代码有什么问题?
- 如果我在第一种情况下设置条件,为什么会有延迟?
- 为什么我要在第二个例子中点击两次?
- 有没有更好的方法来做同样的动作?

4

1 回答 1

0

这只是一个技巧,stop().animate()当您有一系列动画事件时尝试使用,这将减少您的延迟

希望这可以帮助

于 2012-05-10T15:09:51.760 回答