我正在玩Giva Labs jQuery Marquee plugin。示例jsFiddle here。
示例中有两行切换文字:First line
和Second row
。当你开始连续移动鼠标光标并移出浅蓝色框时,文字变得疯狂:线条开始随机移动,不按顺序移动。当你在循环中将鼠标移动速度从慢速变为快速时,疯狂感最强。
我用google搜索“jquery animate stop”并找到了.stop()
和.clearQueue()
效果。我尝试将这些附加到像这样的选框效果:
$("#marquee").marquee().stop();
和此:
$("#marquee").marquee().clearQueue();
也是这样的:
$("#marquee").marquee()
.hover(function() {
$(this).clearQueue();
});
我也尝试使用插件的内置methods:
$("#marquee").marquee()
.hover(function() {
$(this).marquee("pause");
})
.mouseout(function() {
$(this).marquee("resume");
});
他们都没有工作。
如何摆脱这个小故障?
答案 0 :(得分:4)
更新/已解决:
代码:jsFiddle
解决方案摘要:
var timedout
timedout
scroll()
clearTimeout(timedout)
pause()
当您放置一个非常低pauseSpeed
(例如2)时,该错误不会发生,这使我相信由于pause()
和{之间的交互而发生的错误{1}}
具体而言,resume()
中的这段代码:
pause()
if( $marquee.data("marquee.showing") != true ){
// we must dequeue() the animation to ensure that it does indeed stop animation
$lis.filter("." + options.cssShowing).dequeue().stop();
}
中的这段代码:
resume()
以及if ($marquee.data("marquee.showing") != true) scroll($lis.filter("." + options.cssShowing), 1);
中的这段代码:
scroll()
据我所知,问题出现是因为setTimeout(function() {
// if paused, stop processing (we need to check to see if the pause state has changed)
if (paused == true) return false;
// scroll the message down
$li.animate({
top: (options.yScroll == "top" ? "+" : "-") + $marquee.innerHeight() + "px"
}, options.showSpeed, options.fxEasingScroll);
// finish showing this message
finish($li);
}, delay);
[有意义]是立竿见影的,dequeue().stop()
有一些代码延迟发生(scroll(...)
。
所以会发生以下情况:
pauseSpeed)
pause()
调用resume()
,它会在2000毫秒内设置超时功能要解决此问题,我建议您每次停止动画时编辑scroll()
代码并实际调用jquery.marquee.js
。
答案 1 :(得分:2)
我已将您的代码更新为JSFiddle。 http://jsfiddle.net/AkQgH/7/
我无法复制快速移动。您获得快速滚动的原因是当您移出并在特定块内的光标中它会产生暂停和播放事件。 你可以使用
setTimeout(
function()
{
}, 5000);
在暂停事件之后延迟你想要等待的时间,它不会产生奇怪的效果。
更新了网址。删除JS错误到目前为止你的代码应该是“marquee”而不是“marque”。 - 另外一个错误就是“结束”你需要使用“mouseover”