jquery - JQuery/CSS 如何获取对象的旋转值

Question

我有一个代码可以根据 YOffset 来回旋转和成像。但是，我想知道如何获得图像的旋转度数并将其用作我的 if 语句。

代码:

<script type="text/javascript">
    $(function() {
        var sdegree = 0; 
        $(window).scroll(function() {
            sdegree = ( window.pageYOffset > 1000 ) ? sdegree + 4 : sdegree - 4;
            var srotate = "rotate(" + sdegree + "deg)";
            $(".plane").css({
            transform : srotate
        });
      });
    });   
</script>

我想要的:

<script type="text/javascript">
    $(function() {
        var sdegree = 0; 
        $(window).scroll(function() {
            sdegree = ( //INSERT DEGREES that .plane has been rotated > 30deg )// ? sdegree + 4 : sdegree - 4;
            var srotate = "rotate(" + sdegree + "deg)";
            $(".plane").css({
                transform : srotate
            });
        });
    });   
</script>

Answer 1

实际上，我最近还必须旋转元素的度数。我的方法与此类似:

function calculateAngle(element) {
    var tr = (window.getComputedStyle(element, null)).getPropertyValue("-webkit-transform"),
        values = tr.split("(")[1],
        values = values.split(")")[0],
        values = values.split(","),
        a = values[0],
        b = values[1],
        c = values[2],
        d = values[3],
        radians = Math.atan2(b, a);
    if (radians < 0) {
        radians += (2 * Math.PI);
    }
    return Math.round(radians * (180 / Math.PI));
}

var element = document.getElementById("rotate");
calculateAngle(element);

Example

然后您可以根据 Angular 使用任何您想要的 if 语句。