carouFredSel滚动鼠标按下

时间:2013-04-18 20:50:22

标签: javascript jquery carousel caroufredsel

我需要制作一个旋转木马,它可以在鼠标上滚动并在鼠标停止时停止。 让这个例子在悬停上工作。如何改变它以在mousedown上工作?

$("#foo2").carouFredSel({
    auto    : {
        items           : 1,
        duration        : 1500,
        easing          : "linear",
        timeoutDuration : 0
    }
}).trigger("pause");

$("#foo2_prev").hover(function() {
    $("#foo2").trigger("configuration", ["direction", "right"]);
    $("#foo2").trigger("play");
}, function() {
    $("#foo2").trigger("pause");
}).click(function() {
    return false;
});

$("#foo2_next").hover(function() {
    $("#foo2").trigger("configuration", ["direction", "left"]);
    $("#foo2").trigger("play");
}, function() {
    $("#foo2").trigger("pause");
}).click(function() {
    return false;
});

1 个答案:

答案 0 :(得分:1)

carouFredSel初始化代码可以保持不变。然后使用以下代码触发mousedown和mouseup上的事件,而不是悬停。

this.$("#foo2_prev").mousedown(function() {
    me.$("#foo2").trigger("configuration", ["direction", "right"]);
    me.$("#foo2").trigger("play");
});

this.$("#foo2_next").mousedown(function() {
    me.$("#foo2").trigger("configuration", ["direction", "left"]);
    me.$("#foo2").trigger("play");
});

this.$("#foo2_prev, #foo2_next").mouseup(function() {
    console.log("mouseup");
    me.$("#foo2").trigger("pause");
});