首页 > web前端 > css教程 > 如何使用 jQuery 从元素的 CSS 转换中提取旋转值?

如何使用 jQuery 从元素的 CSS 转换中提取旋转值?

Barbara Streisand
发布: 2024-12-07 13:47:15
原创
874 人浏览过

How Can I Extract the Rotation Value from an Element's CSS Transform Using jQuery?

使用 jQuery 检索元素旋转值

在 CSS 中,通常使用 -moz-transform 属性对元素应用转换。然而,使用 jQuery 从该属性中提取特定的旋转值一直是一个挑战。

问题:

如何获取应用于特定 HTML 元素的数字旋转值通过 jQuery,尽管它存储在复杂的矩阵转换中string?

答案:

此解决方案提供了一个 jQuery 函数,可以从 -moz-transform 属性中提取旋转度数:

function getRotationDegrees(obj) {
    var matrix = obj.css("-webkit-transform") ||
    obj.css("-moz-transform")    ||
    obj.css("-ms-transform")     ||
    obj.css("-o-transform")      ||
    obj.css("transform");
    if(matrix !== 'none') {
        var values = matrix.split('(')[1].split(')')[0].split(',');
        var a = values[0];
        var b = values[1];
        var angle = Math.round(Math.atan2(b, a) * (180/Math.PI));
    } else { var angle = 0; }
    return (angle < 0) ? angle + 360 : angle;
}
登录后复制

用法:

检索旋转值对于类 myDiv 的元素,使用:

angle1 = getRotationDegrees($('#myDiv'));
登录后复制

对于类 mySpan 的元素中的最后一个锚点,使用:

angle2 = getRotationDegrees($('.mySpan a:last-child'));
登录后复制

以上是如何使用 jQuery 从元素的 CSS 转换中提取旋转值?的详细内容。更多信息请关注PHP中文网其他相关文章!

来源:php.cn
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
作者最新文章
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板