Thanks for your answer Leonardo.
The callback is not called once.
$("#menu li:not(.selected)").animate({
marginLeft: "-200px"
}, function() {
$("#menu").hide();
alert("Hello");
});
Hello gets printed many times.
--
Mathieu
On Aug 5, 3:29 pm, Leonardo K <leo...@gmail.com> wrote:
> Use the callback function
>
> $("#menu li").click(function() {
> // toggle selected item in list
> $(this).toggleClass("selected");
> // animate all other LI elements to disappear (sliding left)
> $("#menu li:not(.selected)").animate({
> marginLeft: "-200px"
> }, function(){
> $("#menu").hide();
> });
>
> });
> On Wed, Aug 5, 2009 at 04:01, Mathieu <mathieu.led...@gmail.com> wrote:
>
> > Hi all,
>
> > I would like to know when a set of animations, started inside an
> > "each" function, is finished.
> > In the following example, how can I simply hide the whole #menu
> > element once LI elements have been fully animated ?
>
> > ------------------- HTML
>
> > <div id="menu">
> > <ul>
> > <li>One</li>
> > <li>Two</li>
> > <li>Three</li>
> > <li>Four</li>
> > </ul>
> > </div>
>
> > ------------------- JS
>
> > // add click behaviour
> > $("#menu li").click(function() {
> > // toggle selected item in list
> > $(this).toggleClass("selected");
> > // animate all other LI elements to disappear (sliding left)
> > $("#menu li:not(.selected)").each(function(index, domElement) {
> > $(this).animate({
> > marginLeft: "-200px"
> > });
> > });
> > });
