2

所以我试图弄清楚如何在 jquery 上显示动画后显示一个不可见的 div。这是显示 div 的代码:

$('#box_green')
    .css({
        visibility: "visible",
        opacity: 0
    })
    .fadeIn('slow')
;

也使 div 不可见的 css:

div#box_green{
    background-image:url(../images/bg_stripe_green.png);
    background-repeat:repeat;
    width: 478px;
    height:300px;
    position:absolute;
    top:249px;
    z-index:20;
    visibility:hidden;
}

和点击动画:

  $(document).ready(function(){

$("#menu_h, #menu_p, #menu_q, #menu_b, #menu_c").one('click', function(){
    $("#menu_h").animate({"left": "+=419px"}, "slow");
    $("#menu_p").animate({"left": "+=313px"}, "slow");
    $("#menu_q").animate({"left": "+=210px"}, "slow");
    $("#menu_b").animate({"left": "+=104px"}, "slow");
    $("#menu_c").animate({"left": "+=0px"}, "slow");
    $("#menu_h, #menu_p, #menu_q, #menu_b, #menu_c").unbind('click');
 });

});

如何在#menu_h动画完成后显示 box_green div?假设我也有一个隐藏的#box_yellowdiv,在再次淡出 box_green 之后(让它再次不可见),我怎样才能让它可见(与 box_green div 的效果相同)。我实际上有 5 个 div(box_green 和 box_yellow 是其中的 2 个)需要“关闭当前显示的 div 并显示 div clicked”事件。

4

2 回答 2

5

您将需要实施callback.

来自http://docs.jquery.com/Effects/animate#examples

使用回调函数的示例。第一个参数是一个 CSS 属性数组,第二个指定动画需要 1000 毫秒才能完成,第三个表示缓动类型,第四个参数是一个匿名回调函数。

$("p").animate({
       height:200, width:400, opacity: .5
    }, 1000, "linear", function(){alert("all done");} );

替换function(){alert("all done");}为您自己的功能以使某些东西出现,消失,任何东西......:P

于 2009-11-14T09:16:15.227 回答
0

您还可以使用showandhide函数,而不是使用元素的 CSS,或者即使toggle您显示/隐藏相同的元素。

于 2009-11-14T09:20:07.093 回答