Délai slideDown () / slideUp () - menu déroulant jquery

Question

Je crée Je crée une chute vers le bas que je veux retard sur les 250 ms pour que cela ne se déclenche pas quand quelqu'un défile rapidement sur le bouton.

Voici mon code actuel. J'ai essayé d'utiliser la méthode retard () mais ça ne va pas bien.

$(".deltaDrop").hover(function(){
    $('.deltaDrop ul').stop(false,true).slideDown(250);
    $('.delta').css('background-position','-61px -70px');
},function(){
    $('.deltaDrop ul').stop(false,true).slideUp(450);
    $('.delta').css('background-position','-61px 0');
});

Merci

Answer 1

var timer;
timer =     setTimeout(function () {
                    -- Your code goes here!
                }, 250);

Ensuite, vous pouvez utiliser la fonction clearTimeout () comme celui-ci.

 clearTimeout(timer);

Answer 2

Cela devrait fonctionner.

$(".deltaDrop").hover(function(){
    $('.deltaDrop ul').stop(false,true).hide(1).delay(250).slideDown();
    $('.delta').css('background-position','-61px -70px');
},function(){
    $('.deltaDrop ul').stop(false,true).show(1).delay(450).slideUp();
    $('.delta').css('background-position','-61px 0');
});

.delay ne fonctionne que lorsque vous avez affaire à la file d'attente d'animation. .hide() et .show() sans arguments ne pas interagi avec la file d'attente d'animation. En ajoutant le .hide(1) et .show(1) avant la .delay() rend le diaporama des animations attendent sur la file d'attente.

Answer 3

  setTimeout(function() {
    $('.deltaDrop ul').slideDown()
  }, 5000);

Answer 4

Untested, unrefactored:

$(".deltaDrop")
  .hover(
    function()
    {
      var timeout = $(this).data('deltadrop-timeout');

      if(!timeout)
      {
        timeout =
          setTimeout(
            function()
            {
              $('.deltaDrop ul').stop(false,true).slideDown(250);
              $('.delta').css('background-position','-61px -70px');
              $('.deltaDrop').data('deltadrop-timeout', false);
            },
            250
          );
        $(this).data('deltadrop-timeout', timeout);
      }
    },
    function()
    {
      var timeout = $(this).data('deltadrop-timeout');
      if(!!timeout)
      {
        clearTimeout(timeout);
        $('.deltaDrop').data('deltadrop-timeout', false);
      }
      else 
      {
        $('.deltaDrop ul').stop(false,true).slideUp(450);
        $('.delta').css('background-position','-61px 0');
      }
    }
  );