如何在鼠标悬停时暂停新闻滑块，并在鼠标上弹出？
如何在鼠标悬停时暂停新闻滑块，并在鼠标上弹出？
提问于 2013-10-07 19:14:37
<body>
<ul id="ticker">
<li>
<p>Innovation - The Power of 4S The progress of Auto Industry stands on the four basic pillars.</p>
<p>The S pillars and it would not be an overstatement that the combination thr illed the Auto-Indutry.</p>
</li>
<li>
<p>Innovation - The Power of 4S The progress of Auto Industry stands on the four basic pillars.</p>
<p>The S pillars and it would not be an overstatement that the combination thr illed the Auto-Indutry.</p>
</li>
<li>
<p>Innovation - The Power of 4S The progress of Auto Industry stands on the four basic pillars.</p>
<p>The S pillars and it would not be an overstatement that the combination thr illed the Auto-Indutry.</p>
</li>
</ul>
<script>
function tick(){
$('#ticker li:first').slideUp( function () { $(this).appendTo($('#ticker')).slideDown(); });
}
setInterval(function(){ tick () }, 2000);
这是简单新闻滑块的代码。如何在鼠标悬停时暂停新闻滑块，并在鼠标上弹出？
回答 4
Stack Overflow用户
发布于 2013-10-07 19:18:29
将setInterval赋值给一个变量，这样就只有一个interval对象可以重用。
setInterval interval_id = var (...
在您的悬停事件上，使用clearInterval(interval_id)停止它，并在鼠标离开/退出时恢复它。
Stack Overflow用户
发布于 2013-10-07 19:18:50
试试这个：
基本的想法是清除悬停时的setInterval，它应该停止滑块，然后在鼠标输出时重新启动它。
$(document).ready(function() {
var clearTick = setInterval(function(){ tick () }, 2000);
$('div').hover(
function () {
clearInterval(clearTick);
},
function () {
clearTick = setInterval(function(){ tick () }, 2000);
}
);
});Stack Overflow用户
发布于 2013-10-07 19:19:09
sliderTick = setInterval(function(){ tick () }, 2000);
$('#ticker li').mouseover(function(){
clearInterval(sliderTick);
}
$('#ticker li').mouseout(function(){
sliderTick = setInterval(function(){ tick () }, 2000);
}当鼠标结束时，基本上停止调用函数，并在鼠标输出时恢复调用
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/19223382
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号