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})
        }
     } 
});

jquery在mousemove上顺利旋转

2 个答案: