jQuery动画应该在悬停时暂停

这是我的代码:

var animationDuration = 3000;

var firstText = $(".text:first-child");
var currentText = firstText;

function changeText() {
  $(currentText).css("display", "none");
  var NextText = currentText.next(".text");
  if (!NextText.length) NextText = firstText;
  $(NextText).css("display", "block");
  currentText = NextText;
}

var loopTimer = setInterval(changeText, animationDuration);

$('.animatedText').hover(function(e) {
  clearInterval(loopTimer);
}, function(e) {
  changeText();
  loopTimer = setInterval(changeText, animationDuration);
})
.text {
  display: none;
  white-space: pre-wrap;
  font-size: 30px;
  cursor: default;
}

.text:nth-child(1) {
  display: block;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<section>
  <div>One</div>
  <div>Two</div>
  <div>Three</div>
  <div>Four</div>
</section>
以上是jQuery动画应该在悬停时暂停的全部内容。
THE END
分享
二维码
< <上一篇
下一篇>>