Actually, never mind - I figured it out.
for example, the onShow function:
onShow: function(){ // make it bounce
obj = this.find(">li"); // assigns the li children to obj
obj.animate({height: "23px"}, 200); // applies animation to li
this.animate({marginTop: "15px"}, 200); // applies animation to
the ul
obj.animate({height: "30px"}, 200);
this.animate({marginTop: "-3px"}, 200);
obj.animate({height: "23px"}, 300);
this.animate({marginTop: "3px"}, 300);
this.animate({marginTop: "0px"}, 300);
}
http://www.retropolis.com/clients/etc/superfish/example_martin2.html
What's weird is that the onInit funtion won't let me do something
similar. (have the top level LI's drop into view).
Using:
onInit: function(){
obj = this.find(">li");
obj.css({height: "0px"});
obj.animate({height: "23px"}, 1000);
}
I get this error message in the javascript console:
this.find is not a function
Also, I guess it's not possible to animate the li's on menu close
without hacking the core code, because onHide is triggered after the
menu is made invisible, correct?
Martin
On Mar 31, 1:23 am, Martin Evans <evans...@gmail.com> wrote:
> Hi everyone,
>
> I've been playing with Joel's fantastic menu plugin and was wondering
> if anyone knows if it's possible to animate the LI's at the same time
> the containing UL is being animated?
>
> I've got a simple demo running that *almost* does what I want:
>
> http://www.retropolis.com/clients/etc/superfish/example_martin.html
>
> I'm making the UL's fade-in, fly up and bounce using the the animation
> object to alter margin-top and onShow callback to get the bounce. What
> I'd also like to do is animate the css height property of the LI's as
> they rise, starting out spaced apart and having them come together at
> the end of their travel, and do the opposite in reverse. Is this
> possible to do by passing a parameter, or will editing of the core
> script be required?
>
> Thank you for reading!
>
> Martin
