在 jquery 中旋转 img。我的第一个 img 是完美的旋转但第二个 img 是从以前的 img 中获取值而不是继续

Question

如果将图像从顶部拖到底部块..

然后按下旋转按钮，图像将旋转并尝试对两张三张图像进行旋转，然后您将看到当前图像正在使用上一张图像的值，然后继续..

所以我希望图像具有独立的功能/不依赖于其他..

var value = 0    
 $(".rotate_img").rotate({    
    bind:    
 {    
click: function(){    
value +=45;    
$(ui.draggable).rotate({ animateTo:value})    
}    
}    
});

这是 jsfiddle 的 link...

http://jsfiddle.net/qzgt4p5h/1/

Answer 1

您可以为每个图像添加自定义属性以保存其旋转度数 data-rot="0"，然后使用它来更新旋转角度，如下所示：

$(".rotate_img").rotate({
              bind:
              {
                click: function(){
                   var value = parseInt($(ui.draggable).attr("data-rot"));
                    //console.log($(ui.draggable).attr("data-rot"));
                  value +=45;
                  $(ui.draggable).rotate({ animateTo:value});
                    $(ui.draggable).attr("data-rot",value);
                }
              }
            });

这是一个有效的 fiddle。

在 jquery 中旋转 img。我的第一个 img 是完美的旋转但第二个 img 是从以前的 img 中获取值而不是继续

While rotating img in jquery. my first img is rotation perfectly but the second img is taking the value from previous img and than continue

jquery

image

rotation