在jQuery滑块上单击切换后如何重置计时器

Question

除了两个方面，我有一个几乎可以按我想要的方式工作的滑块。首先，我有功能正常的导航箭头，可以在幻灯片之间进行导航。但是单击这些按钮后计时器不会重置，并且会造成尴尬的体验。如何编写该代码，以便在单击左右导航箭头后重置计时器？其次，我希望滑块在悬停时停止滑动。

提前谢谢！

这是我的HTML

<div id="slider-testimonial">
    <span class="control_next"><img class="nextimg" src="rightarrow" alt=""></span>
    <span class="control_prev"><img class="previmg" src="leftarrow" alt=""></span>
    <ul>
      <li>
        <img src="img1" alt="">
      </li>
      <li>
        <img src="img2" alt="">
      </li>
      <li>
        <img src="img3" alt="">
      </li>
      <li>
        <img src="img4" alt="">
      </li>
      <li>
        <img src="img5" alt="">
      </li>
     </ul>  
</div>

这是我的CSS

#slider-testimonial {
  position: relative;
  overflow: hidden;
  padding: 0;
  margin: 0 auto;
}

#slider-testimonial ul {
  position: relative;
  margin: 0;
  padding: 0;
  list-style: none;
}

#slider-testimonial ul li {
  position: relative;
  display: block;
  float: left;
  margin: 0;
  padding: 0;
  height: 400px;
  width: 200px;
}

span.control_prev, span.control_next {
  position: absolute;
  top: 40%;
  z-index: 999;
  display: block;
  width: auto;
  height: auto;
  text-decoration: none;
  cursor: pointer !important;
}

这是我的JavaScript

jQuery(document).ready(function ($) {
    setInterval(function () {
        moveRight();
    }, 9000);

  var slideCount = $('#slider-testimonial ul li').length;
  var slideWidth = $('#slider-testimonial ul li').width();
  var slideHeight = $('#slider-testimonial ul li').height();
  var sliderUlWidth = slideCount * slideWidth;
  $('#slider-testimonial').css({ width: slideWidth, height: slideHeight });
  $('#slider-testimonial ul').css({ width: sliderUlWidth, marginLeft: - slideWidth });
    $('#slider-testimonial ul li:last-child').prependTo('#slider-testimonial ul');
    function moveLeft() {
        $('#slider-testimonial ul').animate({
            left: + slideWidth
        }, 700, function () {
            $('#slider-testimonial ul li:last-child').prependTo('#slider-testimonial ul');
            $('#slider-testimonial ul').css('left', '');
        });
    };
    function moveRight() {
        $('#slider-testimonial ul').animate({
            left: - slideWidth
        }, 700, function () {
            $('#slider-testimonial ul li:first-child').appendTo('#slider-testimonial ul');
            $('#slider-testimonial ul').css('left', '');
        });
    };
    $('span.control_prev').click(function () {
        moveLeft();
    });
    $('span.control_next').click(function () {
        moveRight();
    });
});