I'm trying to animate a horizontal lists appearance. It's a top navigation bar.
The following works pretty well, 开发者_运维百科but it animates in from the top (of, I assume, the ul) to the bottom.
How would animate bottom, up?
$("#topnavigation li").css({height:'0'}); // 'hide' it first
$("#topnavigation li", this).stop().animate({height:'23px'},{queue:false,duration:1000});
You have to adjust it's position as well..
$("#topnavigation li").css({height:'0', top:'23'}); // 'hide' it first
$("#topnavigation li", this).stop().animate({height:'23px', top: '0px'},{queue:false,duration:1000})
;
of course, top's starting value could be different, it depends on your styling for the element. You might use top, or margin-top; depends on the css.
You can also use the slide effect in jqueryui and specify direction up and down for hide and show.
精彩评论