Rumah > Artikel > hujung hadapan web > Bagaimana untuk mengubah suai atribut transformasi elemen dalam jquery
Bagaimana untuk mengubah suai atribut transformasi elemen dalam jquery
- WBOYasal
- 2022-09-09 15:50:152464semak imbas
Dalam jquery, anda boleh menggunakan kaedah css() untuk mengubah suai atribut transformasi elemen; kaedah css() boleh digunakan untuk menetapkan atau mengembalikan satu atau lebih atribut gaya elemen yang dipilih, dan atribut transform boleh digunakan untuk Untuk menetapkan gaya putaran, penskalaan, pergerakan atau kecondongan elemen, sintaksnya ialah "$(elemen yang ditentukan).css("transform","nilai atribut ubah suai");".
Persekitaran pengendalian artikel ini: sistem Windows 10, versi jquery 3.6.1, komputer Dell G3.
Cara jquery mengubah suai atribut transformasi elemen
Gunakan kaedah jQuery css()
kaedah css() untuk menetapkan atau mengembalikan Satu atau lebih atribut gaya bagi elemen yang dipilih.
Kembalikan sifat CSS
Untuk mengembalikan nilai sifat CSS yang ditentukan, sila gunakan sintaks berikut:
css("propertyname");Tetapkan sifat CSS
Untuk menetapkan sifat CSS tertentu, gunakan sintaks berikut:
css("propertyname","value");Atribut transformasi menggunakan 2D pada elemen atau penukaran 3D. Sifat ini membolehkan kita memutar, menskala, mengalih atau mencondongkan elemen.
Contoh adalah seperti berikut:
<!DOCTYPE html>
<html>
<head>
<script src="/jquery/jquery-1.11.1.min.js"></script>
<script>
$(document).ready(function(){
$("button").click(function(){
$("div").css("transform","rotate(-9deg)");
});
});
</script>
</head>
<style>
div
{
margin:30px;
width:200px;
height:100px;
background-color:yellow;
/* Rotate div */
transform:rotate(9deg);
-ms-transform:rotate(9deg); /* Internet Explorer */
-moz-transform:rotate(9deg); /* Firefox */
-webkit-transform:rotate(9deg); /* Safari 和 Chrome */
-o-transform:rotate(9deg); /* Opera */
}
</style>
<body>
<div>Hello World</div>
<button>设置div元素的transform属性</button>
</body>
</html>Hasil keluaran:
Cadangan tutorial berkaitan: Tutorial video jQuery
Atas ialah kandungan terperinci Bagaimana untuk mengubah suai atribut transformasi elemen dalam jquery. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!