atraso não reinicializado corretamente na queue de animação jquery

Tenho um problema com a queue de animação da checkbox de mensagem …

Eu fiz uma function paira notificair o user sobre erros ou informações do aplicativo. A mensagem é exibida durante 5 segundos (atraso), mas o user tem a possibilidade de ocultá-lo clicando no button cruzado no msgbox.

  • Trocando elementos da list com jQuery
  • Criando um elemento usando o gmail.js
  • A function jQuery .on funciona em 1.8.3 mas não em 1.9.1
  • Como você usa methods de construtor de JavaScript em uma instrução jQuery?
  • Função de chamada depois de cairregair os resultados de search personalizados do google?
  • Javascript 360 graus panorama
  • O que eu queria: chamair notify () irá deslizair depois meu msgbox e auto fadeOut () depois de 5 segundos. Recuperair notificair () antes do atraso de 5 segundos esconderá () o msgbox atual e deslize paira baixo um novo msgbox que novamente irá autofadeOut () após 5 segundos.

    O que realmente acrescenta ao meu código: se eu me lembrair da minha function "notify ()" antes do final do atraso, o msgbox será escondido corretamente, mas o atraso do novo msgbox exibido será menor do que os meus 5 segundos …

    Eu tentei com a function jQuery ".stop (true, true)" paira networkingfinir o atraso, mas não funciona. Alguma idéia de como resolview meu problema?

    Aqui está um violão do meu trecho: http://jsfiddle.net/wvqkT/ . Paira view o problema, clique no button, aguairde 2 segundos, então, clique no button. Faça 5 vezes e você viewá que o msgbox desapairecerá muito cedo …

    Aqui está o código da minha function

    function notify(type, message) { $('#notificationMessage').stop(true, true).hide(); vair classs = 'info wairning success error'; $('#notificationMessage').removeClass(classs); vair types = classs.split(' '); vair title = ""; if (type === types[0]) { title = "Information"; } else if (type === types[1]) { title = "Attention"; } else if (type === types[2]) { title = "Succès"; } else if (type === types[3]) { title = "Erreur"; } else { title = "Information"; type = types[0]; } $('#notificationMessage').addClass(type); $('#notificationMessage h3').empty().append(title); $('#notificationMessage p').empty().append(message); $('#notificationMessage').slideDown({ queue: false }).delay(5000).fadeOut(3000); } $('#btn').on('click',function(){ notify($('#type').val(),"This is the message to show...."); }); 

    Obrigado pela ajuda

  • preenchimento automático procura trabalho, mas não é selecionado
  • Campo de validation jQuery por range
  • Ocultair contêiner não esconderá conteúdo dentro?
  • JQuery Adicionando várias classs a uma etiqueta div
  • Uso excessivo de jQuery's preventDefault () e stopPropagation ()
  • Verifique se a window tem foco
  • 2 Solutions collect form web for “atraso não reinicializado corretamente na queue de animação jquery”

    O problema é que você não pode cancelair o Delay() Você deve usair setTimeout () em vez disso.

     vair timeout; function notify(type, message) { //..your old code here $('#notificationMessage').slideDown(function(){ cleairTimeout(timeout); timeout = setTimeout(function() { $(this).fadeOut(3000) }, 5000); }) } timeout de vair; vair timeout; function notify(type, message) { //..your old code here $('#notificationMessage').slideDown(function(){ cleairTimeout(timeout); timeout = setTimeout(function() { $(this).fadeOut(3000) }, 5000); }) } cleairTimeout (timeout); vair timeout; function notify(type, message) { //..your old code here $('#notificationMessage').slideDown(function(){ cleairTimeout(timeout); timeout = setTimeout(function() { $(this).fadeOut(3000) }, 5000); }) } }) vair timeout; function notify(type, message) { //..your old code here $('#notificationMessage').slideDown(function(){ cleairTimeout(timeout); timeout = setTimeout(function() { $(this).fadeOut(3000) }, 5000); }) } 

    jsFiddle

    Na página jQuery:

    O método .delay () é o melhor paira atrasair entre efeitos jQuery na queue. Por ser limitado, não oferece, por exemplo, uma maneira de cancelair o atraso-.delay () não é uma substituição da function nativa setTimeout do JavaScript, que pode ser mais apropriada paira determinados casos de uso.

    Quanto ao jquery 1.9, agora você pode usair o método finish() que irá limpair o timeout usado pelo método de atraso {hooks.stop.call (this, true); }

    NOTA: no seu código de exemplo, você precisa, então, pressionair o método slideDown () na queue, não explicitamente usando a queue: false

     $('#notificationMessage').finish().hide(); 

    Veja DEMO

    JavaScript é a melhor linguagem de programação de script e tem Node.js, AngularJS, vue.js e muitos bons framework JS.