$.textillate('stop') doesn't work

[Danelund]

Calling $.textillate('stop') doesn't work. Nothing happens. Can't find a working sample.

[jschr]

The stop method was added by @kodeaffe in #47. I've never used it myself. I'm guessing since stop just clears the out animation timeout, calling it during the out transition will still cause the next in animation to fire, causing the out to fire again. I believe that the quick fix would be set something like base.isStopped = true in the stop method and prevent the in animation from firing if the flag is set.

Would gladly accept a PR for this or will have to wait until I get a moment to test out the fix.

[ohpyupi]

I got a same issue with @Danelund . But thanks @jschr , your suggestion worked!

[ohpyupi]

I have another issue with 'stop' method. I am wondering if any of you can help me finding solutions.
I want to run only a loop of an animation effect. Text coming in and going out only once.
So what I am trying is to using callback function after out-animation.

$('.className').textillate({ loop: true, out: { callback: function () { $(''.className).textillate('stop'); }, }, });

I put the fix, but it still doesn't work for it.

[jschr]

@ohpyupi would you be able to post your fix in case in helps others?

If I understand correctly, the root problem is that loop: false doesn't trigger the out effect. You could try loop: false with an empty item at the end of the loop: http://jsfiddle.net/jschr/t5cqnep7/

[ohpyupi]

I was having an issue with stop method and tried to make a button to trigger stop button. To test whether it's actually working or not... I thought your fix cleared the problem, but I think it didn't.

As you mentioned, during the animation, the stop method doesn't see base.timeoutRun. But when when the animation stops (a short interval between in-animation and out-animation).

Original coding

base.stop  = function () {
  if (base.timeoutRun) {
    clearInterval(base.timeoutRun);
    base.timeoutRun = null;
  }
}

So if I catch the moment when the animation stops and click the button that triggers stop method, then the animation can be stopped.

what the button looks like

$('.btnClassName').on('click', function () {
  $('aniObejct').textillate('stop');
});

[lukalev]

You can stop the loop after out animation by editing jquery.textillate.js and using a counter.
Initialize a counter (st in my case) globally. Then on first line of run method add if(st > 1) return; to exit loop after first iteration. And then increment counter.

(function run(index) { if(st > 1) return; st++; ...

[Tritek]

@lukalev
After your change the stop function works fine, but start don't work
$('.tlt').textillate('start');
Can you help me?