ansaurus

Question

Stopping a jquery function from acting multiple times

Answer 1

+2 A:

You need to check if the element is not :animated, if so invoke the .animate:

  <body>
    <button class="open">open</button><br>
    <div id="fadeMe">fade me!</div>
    <style>#fadeMe { 
    width:20em;
    height:10em;
    background:black;
    color:#fff;
    }</style>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"&gt;&lt;/script&gt;
    <script>
    jQuery.fn.fadeToggle = function(speed, easing, callback) {
      return this.animate({opacity: 'toggle'}, speed, easing, callback);  
    };



    $(document).ready(function() {
      $('.open').click(function() {
        var el = $('#fadeMe').next();
        if ( !el.is(':animated') ) {
            $(el).fadeToggle('slow');
        }
      });
    });
    </script>
    </body>

Demo: http://jsbin.com/irare

meder 2009-10-06 00:46:01

updated solution.

meder 2009-10-06 00:55:53

Sweet it works :)

PHPNooblet 2009-10-06 01:02:45

This answers the question... but look at stop() answer below... that's what most people want in this situation.

ndp 2009-10-06 02:45:38

Um - my original solution did incorporate stop, but I just thought of an alternative solution, that and I think I targeted the wrong elements in my original solution.

meder 2009-10-06 03:16:34

Answer 2

A:

This has been asked before, but hard to find it doing a search. What I ended up doing is taking a count of how many objects are being animated, and have the callback decrement the count until its zero, and run when its zero.

Frank Schwieterman 2009-10-06 00:46:25

How would I do this?

PHPNooblet 2009-10-06 00:56:09

I"m sorry I misunderstood the question. I thought you asked about the case where there are multiple concurrent animations, not multiple sequential animations.

Frank Schwieterman 2009-10-06 16:32:14

Answer 3

+1 A:

Use .stop(). This stops all animations on an element.

$('#fadeMe').next().stop().fadeToggle('slow');

recursive 2009-10-06 01:16:02

ansaurus

tags:

views:

answers:

Stopping a jquery function from acting multiple times

related questions