Rumah > hujung hadapan web > tutorial css > Bagaimanakah Saya Boleh Mengeluarkan Nilai Putaran daripada Transformasi CSS Elemen Menggunakan jQuery?

Bagaimanakah Saya Boleh Mengeluarkan Nilai Putaran daripada Transformasi CSS Elemen Menggunakan jQuery?

Barbara Streisand
Lepaskan: 2024-12-07 13:47:15
asal
878 orang telah melayarinya

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

Mendapatkan Nilai Putaran Elemen menggunakan jQuery

Dalam CSS, adalah perkara biasa untuk menggunakan transformasi pada elemen menggunakan sifat -moz-transform. Walau bagaimanapun, mengekstrak nilai putaran khusus daripada sifat ini menggunakan jQuery telah menjadi satu cabaran.

Soalan:

Cara mendapatkan nilai putaran berangka yang digunakan pada elemen HTML tertentu melalui jQuery, walaupun ia disimpan dalam transformasi matriks yang kompleks rentetan?

Jawapan:

Penyelesaian ini menyediakan fungsi jQuery yang mengekstrak darjah putaran daripada sifat -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;
}
Salin selepas log masuk

Penggunaan:

Untuk mendapatkan semula nilai putaran elemen dengan kelas myDiv, gunakan:

angle1 = getRotationDegrees($('#myDiv'));
Salin selepas log masuk

Untuk penambat terakhir dalam elemen dengan kelas mySpan, gunakan:

angle2 = getRotationDegrees($('.mySpan a:last-child'));
Salin selepas log masuk

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Mengeluarkan Nilai Putaran daripada Transformasi CSS Elemen Menggunakan jQuery?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel terbaru oleh pengarang
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan