jQuery旋转函数不会触发。

Question

我有以下的jQuery的扩展：

(function ($) { //jQuery plugin extension 

    jQuery.fn.rotate = function(degree, maxDegree) { 
     this.css({ WebkitTransform: 'rotate(' + degree + 'deg)'}); 
     this.css({ '-moz-transform': 'rotate(' + degree + 'deg)'}); 

      // Animate rotation with a recursive call 
     rotation = setInterval(function() { 
      if (degree < (maxDegree/2)) { 
       $(this).rotate(++degree); 
      } else { 
       clearInterval(rotation); 
      } 
     },5); 
    }; 
}(jQuery)); 

我打电话这样说：

$('#test').live('mouseover',function() { 
       $(this).rotate(0, 360); 
      }); 

但它不火，这里是一个的jsfiddle： http://jsfiddle.net/neuroflux/8vZqr/

（注意，小提琴不会因为live()而运行）

Answer 1

你不是ca灌装你有你的插件的功能：

(function ($) { 
    $.fn.rotate = function(degree, maxDegree) { 
     //... 
    }; 
}(jQuery)); // <-- call 

此外，this内setInterval方法并不是指所选择的元素了，但到window。你必须参考保持到this：

var $self = this; 
var rotation = setInterval(function() { 
    if (degree < (maxDegree/2)) { 
     $self.rotate(++degree); 
    //... 
}; 

我会做ALS一个rotation局部变量（与var），否则你会遇到麻烦，如果功能火灾以下几个因素。

至于你的小提琴，你没有选择jQuery作为库使用。

如果这一切都是固定的，it works →。

Answer 2

你也可以看看到jQuery插件：

http://www.zachstronaut.com/projects/rotate3di/