Задержка Slidedown ()/SlideUp () - выпадающий в JQUERY

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

  •  29-09-2019
  •  | 
  •  

Вопрос

Я создаю, я создаю падение, которое я хочу задержать около 250 мс, чтобы он не сработал, когда кто-то быстро прокручивается через кнопку.

Вот мой текущий код. Я попытался использовать метод задержки (), но он не идет хорошо.

$(".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');
});

Спасибо

Это было полезно?

Решение

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

Затем вы можете использовать функцию cleartimeout (), подобную этой.

 clearTimeout(timer);

Другие советы

Это должно работать.

$(".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');
});

.задерживать работает только тогда, когда вы имеете дело с очередью анимации. .hide() и .show() Без аргументов не взаимодействуют с очередью анимации. Добавив .hide(1) и .show(1) перед .delay() Заставляет слайд -анимацию ждать в очереди.

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

Непроверенный, неарфакторный:

$(".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');
      }
    }
  );
Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top