jQuery可旋转（）度 [英] jQuery rotatable() in degree

问题描述

您好我们正在使用jquery rotatble插件来旋转div

Hi we are using jquery rotatble plugin for rotating a div

$( function() {

      $('.new-multiple').rotatable();
});

.new-multiple{
  display:inline-block;
}

<link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/godswearhats/jquery-ui-rotatable@1.1/jquery.ui.rotatable.css">
<script src="https://cdn.jsdelivr.net/gh/godswearhats/jquery-ui-rotatable@1.1/jquery.ui.rotatable.min.js"></script>

<div class="new-multiple">

   <img src="https://www.gravatar.com/avatar/322f808cb7a7e06d38ca4c8a441332fd?s=48&d=identicon&r=PG&f=1">
   </div>

但问题是它旋转了div使用辐射选项。但我们需要使用度数旋转div。那是0到360度。我们如何实现这一目标

But the problem is that it rotate the div using radiant option . But we need to rotate the div using degree . that is 0 to 360 degree. How we can achieve this

我试过

.rotatable({
        options: {
            degrees: true
        }
});     

但这不起作用

推荐答案

因为我需要获得旋转度，我将给定弧度转换为停止事件中的度数

Because i need to get the rotation in degree i converted the given radians to degree in the stop event

$('.new-multiple').rotatable({


        stop: function(e, ui){
             if(ui.angle.current<0){
                   var given_angle=ui.angle.current+2*Math.PI;
                }
                else{ var given_angle=ui.angle.current;  }
                var new_angle=Math.round(given_angle*180/ Math.PI)+"deg";
                $(".new-multiple").css("transform","rotate("+new_angle+")");
        }

    });

这篇关于jQuery可旋转（）度的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！