Question

我在codepen.io中修改了这个脚本，以便在用户将鼠标悬停在文本上时更改一些文本。它对悬停有一个随机播放效果，当你离开悬停区时，它会在一个文本上结束。

由于用户将在移动设备上使用此功能，因此使用触摸复制悬停效果非常困难。我正在考虑允许文本在重复时自动循环，并有一个定时延迟。

当用户登陆“世界末日”时，它会提供不同版本的body类。

var day = [
"monday",
"tuesday",
"wednesday"
],
allDays = day.length,
firstDay = 0,
change = $('.day'),
changeDay = function() {
  change.html(day[firstDay]);
  firstDay = (firstDay + 1) % allDays;
}

function ohNo() {
  ohYeah = setInterval(changeDay, 120);
};

$('.day').hover(function() {
  $('body').removeClass('uhoh');
  $('#link').removeClass('live');
  ohNo();
}, function() {
  clearInterval(ohYeah);
  if ($('.day').text() == 'doomsday') {
    $('body').addClass('uhoh');
    $('#link').addClass('live');

  }
})

我尝试在循环上执行setInterval但是代码在不停止时冻结，然后在初始动画结束后再生成另一个setInterval。但是动画没有正确排列。

理想情况下，我想要复制悬停2秒的效果，然后无限期地暂停2秒。如果有人能用setInterval进行顺序jQuery指向正确的方向，我会很感激。感谢

调整jQuery悬停序列以在循环

0 个答案: