So ändern Sie das Transformationsattribut eines Elements in jquery-Front-End-Fragen und Antworten-php.cn

So ändern Sie das Transformationsattribut eines Elements in jquery

WBOY

Freigeben： 2022-09-09 15:50:15

Original

2476 Leute haben es durchsucht

In jquery können Sie die Methode css() verwenden, um das Transformationsattribut eines Elements zu ändern. Mit der Methode css() können Sie ein oder mehrere Stilattribute des ausgewählten Elements festlegen oder zurückgeben, und das Transformationsattribut kann verwendet werden Wird zum Festlegen der Drehung, Skalierung, Verschiebung oder Neigung des Elements verwendet. Die Syntax lautet „$(angegebenes Element).css(“transform“,“modifizierter Transformationsattributwert“);“.

So ändern Sie das Transformationsattribut eines Elements in jquery

Die Betriebsumgebung dieses Artikels: Windows 10-System, JQuery-Version 3.6.1, Dell G3-Computer.

Wie jquery das Transformationsattribut eines Elements ändert

Verwenden Sie die jQuery-css()-Methode

css()-Methode, um ein oder mehrere Stilattribute des ausgewählten Elements festzulegen oder zurückzugeben.

CSS-Eigenschaften zurückgeben

Um den Wert der angegebenen CSS-Eigenschaft zurückzugeben, verwenden Sie bitte die folgende Syntax:

css("propertyname");

Nach dem Login kopieren

CSS-Eigenschaften festlegen

Um die angegebene CSS-Eigenschaft festzulegen, verwenden Sie bitte Folgendes Syntax:

css("propertyname","value");

Nach dem Login kopieren

Das Transformationsattribut wendet eine 2D- oder 3D-Transformation auf ein Element an. Mit dieser Eigenschaft können wir das Element drehen, skalieren, verschieben oder neigen.

Das Beispiel lautet wie folgt:

<!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>

Nach dem Login kopieren

Ausgabeergebnis:

So ändern Sie das Transformationsattribut eines Elements in jquery

Verwandte Tutorial-Empfehlung: jQuery-Video-Tutorial

Das obige ist der detaillierte Inhalt vonSo ändern Sie das Transformationsattribut eines Elements in jquery. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!