我该怎么做?
$('#forward').mouseenter(
function() {
$("#scroller").trigger("slideTo", [1, "next"]);
}
);
$('#backward').mouseenter(
function() {
$("#scroller").trigger("slideTo", [1, "back"]);
}
);
当我的鼠标位于按钮顶部时,它应该保持滚动状态,当我的鼠标位于按钮外时,它将停止滚动。显然它只会滚动一次然后停止。我需要将按钮悬停激活,以便用户不会一直点击按钮。
参考:http://caroufredsel.frebsite.nl/code-examples/custom-events.php
答案 0 :(得分:2)
我相信你正在寻找http://jsfiddle.net/DNcAS/3/
$("#foo2").carouFredSel({
auto : {
button : "#foo2_play"
},
scroll : {
items : 1,
duration : 1000,
pauseDuration : 0
}
}).trigger("pause");
$('#foo2_next').mouseenter(
function() {
$("#foo2").trigger("configuration", ["direction", "left"])
.trigger("play");
}).mouseleave(function(){
$("#foo2").trigger("pause");
});
$('#foo2_prev').mouseenter(
function() {
$("#foo2").trigger("configuration", ["direction", "right"])
.trigger("play");
}).mouseleave(function(){
$("#foo2").trigger("pause");
});
对于线性滚动,请将配置选项修改为http://jsfiddle.net/DNcAS/4/
scroll : {
items : 1,
duration : 1000,
easing : "linear",
pauseDuration : 0
}
或者您可以mouseenter
http://jsfiddle.net/DNcAS/5/替换mouseleave
和hover
ps:更短的版本http://jsfiddle.net/DNcAS/6/
$('#foo2_next,#foo2_prev').hover(function() {
var dir = $(this).hasClass('next') ? 'left' : 'right';
$("#foo2").trigger("configuration", ["direction", dir])
.trigger("play");
}, function(){
$("#foo2").trigger("pause");
});
答案 1 :(得分:0)
你的意思是这样吗?
var forwardInterval;
$('#forward').mouseenter(
function() {
forwardInterval = setInterval(function() {
$("#scroller").trigger("slideTo", [1, "next"]);
}, 1000);
}
);
$('#forward').mouseleave(
function() {
clearInterval(forwardInterval);
}
);