jQuery текстовая пауза при наведении

Question

Я нашел этот текстовый тикер: http://jsfiddle.net/4mTMw/8/

Как приостановить текст при наведении?

Я пытался:

marquee.hover(function() {
    clearInterval(marquee);
    clearInterval(mar);
    marquee.css('animation-play-state', 'paused');
    mar.css('animation-play-state', 'paused');
    marquee.stop();
    mar.stop();
});

Ничего не работает.

Answer 1

Рабочий пример: https://jsfiddle.net/Twisty/qL93omsj/2/

JavaScript

$(function() {
  var marquee = $('div.marquee');
  marquee.each(function() {
    var mar = $(this),
      indent = mar.width();
    mar.marquee = function() {
      indent--;
      mar.css('text-indent', indent);
      if (indent < -1 * mar.children('div.marquee-text').width()) {
        indent = mar.width();
      }
    };
    mar.data('interval', setInterval(mar.marquee, 1000 / 60));
    mar.hover(function() {
      clearInterval($(this).data("interval"));
    }, function() {
      $(this).data('interval', setInterval(mar.marquee, 1000 / 60));
    });
  });
});

Интервал сохраняется в Данные. Вам нужно будет использовать clearInterval(), чтобы приостановить его.