Delay() или таймаутом с остановкой()?

$('.file a').live('mouseenter', function() {
    $('#download').stop(true, true).fadeIn('fast');
}).live('mouseleave', function() {
    $('#download').stop(true, true).fadeOut('fast');
});

Я хочу, чтобы функция mouseenter имела stop() и задержку в 1 секунду. Поэтому, если я нахожусь над #download, fadeIn должен начинаться после 1 секунды задержки. Если я вытаскиваю мышью, то fadeIn не должен запускаться. Получите меня?

Я действительно не знаю, как это сделать, любые идеи?

Ответ 1

Вам нужно использовать setTimeout() в этом случае из-за того, что .delay() работает (и ваша неспособность отменить его).

$('.file a').live('mouseenter', function() {
  $.data(this, 'timer', setTimeout(function() {
      $('#download').stop(true, true).fadeIn('fast');
  }, 1000));
}).live('mouseleave', function() {
  clearTimeout($.data(this, 'timer'));
  $('#download').stop(true, true).fadeOut('fast');
});

Здесь вы можете попробовать здесь.

Если вы используете .delay(), это приведет к деактивации следующей анимации для элемента, независимо от того, была ли вы ранее очищена эта очередь. Таким образом, вам нужен тайм-аут, который вы можете отменить, что указано выше, вручную вызывая setTimeout() и сохраняя результат с помощью $.data(), чтобы вы могли его очистить позже, clearTimeout().

Ответ 2

Я искал ответ на аналогичный вопрос, и я обнаружил, что .animate() также может использоваться для обработки этого, и он подчиняется .stop()

Он будет выглядеть примерно так:

$('.file a').live('mouseenter', function() {
    $('#download')
        .stop(true, true)
        .animate({opacity:0}, 1000);            // one second delay
        .animate({opacity:1}, 'fast', 'swing');
}).live('mouseleave', function() {
    $('#download')
        .stop(true, true)
        .animate({opacity:0}, 'slow', 'swing');
});

Ответ 3

Используйте функцию setTimeout

$('.file a').live('mouseenter', function() {
setTimeout(function(){
    $('#download').stop(true, true).fadeIn('fast');
}, 1000);
}).live('mouseleave', function() {
    $('#download').stop(true, true).fadeOut('fast');
});

setTimeout выполнит код внутри функции после указанных миллисекунд (в этом случае 1000).

Ответ 4

вы можете использовать это на jquery без использования события задержки.

$('.file a').hover(function() {
  time = setTimeout(function() {
     $('#download').fadeIn();
  },1000);
},function(){
    clearTimeout(time);
});

1000 - ваше время, когда после него $('# download') исчезнет.