對鼠標移動

jQuery的平滑旋轉，我想添加一些酷炫的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)'}); 
     });

問題的代碼，這是實時旋轉，我想使它緩慢，加上一些延遲

來源

2013-03-29 user840250

使用animate()：

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

來源

2013-03-29 15:30:14 Nelson

好像不工作對我來說，不旋轉時，沒有任何錯誤 – user840250

無論如何謝謝你關於動畫的建議，jQueryRotate.js + $（「＃旋轉」）旋轉（{animateTo ：p}）適合我。 – user840250

@ user840250它可以爲你工作，如果你添加一個前綴的變換，使其跨瀏覽器，前; -moz-transform，-webkit-transform，-o-transfrom和-ms-transform。你也可以使用1.7.2之前的jquery版本，它會自動添加前綴。 –

我建議你閱讀這http://code.google.com/p/jqueryrotate/wiki/Examples。你有很多旋轉圖像的例子。例如：

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

來源

2013-03-29 15:30:41

回答

相關問題