I have a problem trying to remove a css transistionend event listener. I am able to add the listener with:

e.addEventListener('transitionend',function(event) {
    transitionComplete( event.propertyName );
},false);

I am trying to remove it with

e.removeEventListener('transitionend',function(event) {
    transitionComplete( event.propertyName );
},false); 

No matter where I put the removeEventListener the listen does not get removed. What can I be doing wrong?

I am not using jquery for this.

I have a problem trying to remove a css transistionend event listener. I am able to add the listener with:

e.addEventListener('transitionend',function(event) {
    transitionComplete( event.propertyName );
},false);

I am trying to remove it with

e.removeEventListener('transitionend',function(event) {
    transitionComplete( event.propertyName );
},false); 

No matter where I put the removeEventListener the listen does not get removed. What can I be doing wrong?

I am not using jquery for this.

• javascript
• css
• addeventlistener

1 Answer 1

Don't use an anonymous function, instead name the function and put the removal in the event handler.

var func = function(event) {
   transitionComplete( event.propertyName );
    e.removeEventListener('transitionend',func);
};

e.addEventListener('transitionend',func, false);