Delay function removeClass

Question

I've got a function for my Owl Carousel which is adding a class "turn-on" when current slider is visible, and removing when it's not.

function syncPosition(el){

  var current = this.currentItem;      

  this.owl.owlItems.removeClass('turn-on');

  setTimeout( function() {
  $(this).removeClass("turn-on");
  }, 2000);

  $(this.owl.owlItems[this.owl.currentItem]).addClass('turn-on');

  }

Now I need to add 2 second delay for removeClass. I've tried with set-timeout, delay but I am doing something wrong because it doesn't work.

Check this fiddle

Could somebody help me with this issue?

Possible duplicate of [How does the "this" keyword work?](http://stackoverflow.com/questions/3127429/how-does-the-this-keyword-work) — Teemu, Feb 22 '16 at 18:11

score 1 · Answer 1 · answered Feb 22 '16 at 18:08

1

Because this in timeout is different than in syncPosition. should be

function syncPosition(el){

  var current = this.currentItem;      

  this.owl.owlItems.removeClass('turn-on');
  var t = this;     

  setTimeout( function() {
     $(t).removeClass("turn-on");
  }, 2000);

  $(this.owl.owlItems[this.owl.currentItem]).addClass('turn-on');

  }

answered Feb 22 '16 at 18:08

VahagnNikoghosian

613
6
15

But it still doesn't work. What I want to do is to have the red line (progress bar) from my fiddle visible 2 seconds more at the end. – Lukas Feb 22 '16 at 18:17

Delay function removeClass

1 Answers1