jQueryrotateカーソルで複数の画像を回転させる方法

Question

jqueryrotateプラグインを試していて、カーソルで指定の画像を回転させるだけです。それは別に、私は多くの画像に使用する

http://jsfiddle.nXt/8xwqdk71/ 

を動作させる実行する方法、それは に動作しますが、私は同じIDクラス との2枚の画像を使用したとき、私の質問は、最初のイメージでのみ作業を回転させています。

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

EDIT：また、あなたは世界的にすべての画像の間で共有されていない回転値を持っている必要があります。上記はあなたが複数の画像を持っているときに興味深い回転効果を与えます。 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 }); 
     } 
    } 
}); 

：

更新バージョンは、あります