Question

我无法弄清楚如何设置只在悬停时旋转的jquery旋转功能。

以下是我正在使用的代码：

$('div.settingsButton').hover(function() {
    var angle = 0;
    setInterval(function() {
        angle += 4;
        $(this).rotate(angle);
    }, 50);
},
function() {
    var angle = 0;
    setInterval(function() {
        angle = 0;
        $(this).rotate(angle);
    }, 50);
});

旋转是一个插件，可在此处找到： http://code.google.com/p/jqueryrotate/

Answer 1

在您的计时器功能中，this不是DOM元素。您必须将其存储在变量中。此外，您应在mouseout功能中使用clearInterval。

以下是一些示例代码：

var timer;

$('div.settingsButton').hover(function() {

    var angle = 0,
        $this = $(this);

    timer = setInterval(function() {
        angle += 4;
        $this.rotate(angle);
    }, 50);
},
function() {

    timer && clearInterval(timer);
    $(this).rotate(0);
});

这是小提琴：http://jsfiddle.net/ptJuU/

使用Jquery在悬停时旋转

1 个答案: