jquery - jquery在mousemove上平滑旋转

Question

我想在鼠标移动时添加一些带有旋转背景的酷 UI，比如在 icloud.com 上，现在我得到了下面的代码

        $("#VIEW").mousemove(function(e){
             var pageCoords = e.pageX + e.pageY;
             var max = $(document).width() + $(document).height();
                 var p = (pageCoords/max)*30;
             $('#ROTATE').css({ 'transform':'rotate(' + p + 'deg)'});
        });

问题是，这是实时旋转，我喜欢让它变慢，添加一些延迟

Answer 1

使用animate()：

$('#ROTATE').animate({ 'transform':'rotate(' + p + 'deg)'}, 600);

Answer 2

我建议您阅读此http://code.google.com/p/jqueryrotate/wiki/Examples。你有很多旋转图像的例子。例如 ：

$("#img").rotate({ 
   bind: 
     { 
        mouseover : function() { 
            $(this).rotate({animateTo:180})
        },
        mouseout : function() { 
            $(this).rotate({animateTo:0})
        }
     } 
});