0

I would to know how can I remove all the attached events to an HTML element in jQuery. We suppose that we have the instruction below:

$('<div class="notification" style="bottom:'+ind+'px">Message envoyé '+i+'<span class="close">x</span></div>').fadeIn(1000,"linear").delay(5000).fadeOut(3000,"linear");

How can I remove the fadeIn, delay and fadeOut events which are attached to the html event without using on(), bind()....etc ??...In fact I tried with .off(), .unbind(), .die(), .undelegate() but it didn't work. Is there anyone who has an idea?

Thanks in advance.

Deduplicator
  • 44,692
  • 7
  • 66
  • 118
Nadim
  • 382
  • 1
  • 7
  • 29
  • 1
    Those aren't events, those are jQuery functions. Events are click, mouseover, keyup, etc. – j08691 Jun 20 '14 at 15:53
  • 1
    These aren't events: they are queued functions. Maybe `dequeue` would do the trick? http://api.jquery.com/dequeue/ It's not likely, though, as you would need to interrupt control flow before `fadeIn` was called. – ajm Jun 20 '14 at 15:53
  • those aren't events, they are added to the animation queue. so what about .stop()? http://api.jquery.com/stop/ – Shanimal Jun 20 '14 at 15:59
  • @ajm: I tried dequeue() method but when I mouseover the div there will be a fadeout directly, what I really would like is when I mouseover the div there will not be a fadeOut at all. do you have any idea how to do that?? – Nadim Jun 20 '14 at 16:42

1 Answers1

0

I'm guessing you want to .stop the animation inside a hover... I don't have your html and css, but i created a JSBIN. Sorry it took so long to get back to you regarding your question, I was setting up my dev environment.

// where msgEl is the new element you create
msgEl 
  .hover(function(){
    tmpl.stop(1,1).fadeIn(1);
  },function(){
    tmpl.stop(1,1).fadeIn(1);
  })
  .hide(0)
  .fadeIn(1000,"linear")
  .delay(5000)
  .fadeOut(3000,"linear");

JSBIN

Shanimal
  • 11,517
  • 7
  • 63
  • 76
  • I tried that, but when I mouseover the div it disappears directly, what I really would like is when I mouseover the div there will not be a fadeOut. – Nadim Jun 20 '14 at 16:36
  • ok i changed it to do the hover behavior, sorry it wasn't clear at first :) – Shanimal Jun 20 '14 at 18:52
  • in fact, this is my complete code: [link](http://jsbin.com/tawix/1/edit)...what shall I add to the line below to make it work correctly??: var a = $('
    Message envoyé '+i+'x
    ').fadeIn(1000,"linear").delay(5000).fadeOut(3000,"linear").hover(function(){},function(){}); Thanks in advance.     – Nadim Jun 23 '14 at 10:15
  • exactly, just add `$(this).stop(1,1).fadein(1)` inside the first hover callback. That stops the animation on hover and forces it to fade back in... – Shanimal Jun 23 '14 at 16:21