2 回答

TA貢獻1848條經驗 獲得超2個贊
還是從 matrix 入手吧, 其實都不需要完全明白 matrix 里每個數字表示什么意思, 只要知道里面有 cosθ sinθ 之類的就可以了.
拿 rotateX(30deg)
為例, 得到 computed style 為:
matrix3d(1, 0, 0, 0, 0, 0.866025403784439, 0.5, 0, 0, -0.5, 0.866025403784439, 0, 0, 0, 0, 1)
第 6, 7 個數字就是我們想要的值啦, 那么正則提出來, 三角函數一算, 搞定.
囧剛剛寫的有問題, 改了下.
var ele = $('.tag').css('webkitTransform', 'rotateX(-30deg)').get(0);
var groups = window.getComputedStyle(ele).transform.match(/(?:[^,]+,){5}\s*([^,]+),\s*([^,]+)/);
var angle;
if (groups) {
var numbers = groups.slice(1).map(function(n) { return Number(n); });
angle = Math.atan(numbers[1] / numbers[0) / Math.PI * 180 + (numbers[0] < 0 ? 180 : 0);
if (angle < 0) {
angle += 360;
}
} else {
angle = 0;
}
angle;
以上角度的范圍是 0~360 度.
- 2 回答
- 0 關注
- 1362 瀏覽
添加回答
舉報