L'arrêt d'une fonction jquery d'agir à plusieurs reprises

StackOverflow https://stackoverflow.com/questions/1523098

  •  19-09-2019
  •  | 
  •  

Question

J'ai un effet de fondu à bascule, mais lorsque vous cliquez sur le bouton plusieurs fois elle se fane et plus d'une fois. (Donc, si je clique sur l'ID de fondu 20 fois rapidement il disparaître et à plusieurs reprises) Comment puis-je arrêter cela et faire en sorte que vous ne pouvez activer ou désactiver le fondu lorsque l'animation a été fait? J'ai essayé d'obtenir la valeur actuelle et de faire une déclaration, mais si cela n'a pas fonctionné: * (

Merci 

jQuery.fn.fadeToggle = function(speed, easing, callback) {
  return this.animate({opacity: 'toggle'}, speed, easing, callback);  
};



$(document).ready(function() {
  $('.open').click(function() {
    $('#fadeMe').next().fadeToggle('slow');
  });
});
Était-ce utile?

La solution

Vous devez vérifier si l'élément est pas: animé, le cas échéant invoquer la .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"></script>
    <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>

Démo: http://jsbin.com/irare

Autres conseils

Utilisez .stop(). Cela empêche toutes les animations sur un élément. 

$('#fadeMe').next().stop().fadeToggle('slow');
Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top