如何停止此 jquery 选取框在鼠标悬停时滚动

Question

我使用了下面的jquery选取框，但是它不能在鼠标悬停时停止..jquery有什么解决办法吗……

 <script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script type="text/javascript" src="http://cdn.jsdelivr.net/jquery.marquee/1.3.1/jquery.marquee.min.js"></script>

<script type="text/javascript">
$('.marquee').marquee({
    //speed in milliseconds of the marquee
    duration: 10000,
    //gap in pixels between the tickers
    gap: 100,
    //time in milliseconds before the marquee will start animating
    delayBeforeStart: 0,
    //'left' or 'right'
    direction: 'left',
    //true or false - should the marquee be duplicated to show an effect of continues flow
    duplicated: true
});
</script>

.marquee {
  width: 300px;
  overflow: hidden;
  border: 1px solid #ccc;
  background: #ccc;
}

<div class="marquee">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</div>

Answer 1

您可以使用选项 pauseOnHover。参见：https://github.com/aamirafridi/jQuery.Marquee/blob/master/README.md

Answer 2

$(".marquee").on("mouseover", function(e){
    $(this).marquee("toggle");
});

使用"toggle"方法暂停和恢复动画。

如何停止此 jquery 选取框在鼠标悬停时滚动

How to stop this jquery marquee scrolling on mouse over

html

css

jquery

marquee