Comment modifier l'attribut de transformation d'un élément en jquery-Questions et réponses frontales-php.cn

Comment modifier l'attribut de transformation d'un élément en jquery

WBOY

Libérer： 2022-09-09 15:50:15

original

2483 Les gens l'ont consulté

Dans jquery, vous pouvez utiliser la méthode css() pour modifier l'attribut transform d'un élément ; la méthode css() peut être utilisée pour définir ou renvoyer un ou plusieurs attributs de style de l'élément sélectionné, et l'attribut transform peut être utilisé pour définir la rotation de l'élément., l'échelle, le déplacement ou l'inclinaison, la syntaxe est "$(specified element).css("transform","modified transform attribut value");".

Comment modifier l'attribut de transformation d'un élément en jquery

L'environnement d'exploitation de cet article : système Windows 10, jquery version 3.6.1, ordinateur Dell G3.

Comment jquery modifie l'attribut de transformation d'un élément

Utilisez la méthode jQuery css()

css() pour définir ou renvoyer un ou plusieurs attributs de style de l'élément sélectionné.

Renvoyer les propriétés CSS

Pour renvoyer la valeur de la propriété CSS spécifiée, veuillez utiliser la syntaxe suivante :

css("propertyname");

Copier après la connexion

Définir les propriétés CSS

Pour définir la propriété CSS spécifiée, veuillez utiliser ce qui suit syntaxe :

css("propertyname","value");

Copier après la connexion

L'attribut transform applique une transformation 2D ou 3D à un élément. Cette propriété nous permet de faire pivoter, redimensionner, déplacer ou incliner l’élément.

L'exemple est le suivant :

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

Copier après la connexion

Résultat de sortie :

Comment modifier lattribut de transformation dun élément en jquery