jQueryrotate如何通過光標旋轉多個圖像

Question

我正在嘗試jqueryrotate插件，只需旋轉指定的圖像的遊標。它的工作原理 但我的問題是，當我用2個圖像用相同的ID類 僅旋轉在第一圖像的工作，怎麼辦使它工作分別

http://jsfiddle.nXt/8xwqdk71/ 

我將使用許多圖像。

Answer 1

不能有兩個或更多對象/元素具有相同的id。修改你的代碼來改爲定位一個類。

<img src="https://www.google.com/images/srpr/logo3w.png" class="image"> 

var value = 0 
$(".image").rotate({ 
    bind: 
    { 
     click: function(){ 
      value +=90; 
      $(this).rotate({ animateTo:value}) 
     } 
    } 
}); 

.image{ 
    margin:100px 100px; 
} 

編輯：此外，你需要有不是全局所有的圖像之間共享的旋轉值。當你有多個圖像時，上述將給你一些有趣的旋轉效果。

的更新版本是：http://jsfiddle.net/0nwvt303/

<img src="https://www.google.com/images/srpr/logo3w.png" class="image" rotation=0> 
<img src="https://www.google.com/images/srpr/logo3w.png" class="image" rotation=0> 

$(".image").rotate({ 
    bind: 
    { 
     click: function(){ 
      currRotation = ($(this).attr("rotation") * 1) + 90; 
      $(this).attr("rotation", currRotation); 
      $(this).rotate({ animateTo:currRotation }); 
     } 
    } 
});