Maison > Article > interface Web > Comment changer la position du div avec jquery
Dans jquery, vous pouvez utiliser la méthode css() avec l'attribut margin pour changer la position du div. La méthode css() est utilisée pour définir ou renvoyer un ou plusieurs attributs de style de l'élément sélectionné. utilisé pour définir la marge extérieure de l'élément. Syntaxe Il s'agit de "div object.css (marge : valeur de position modifiée ;)".
L'environnement d'exploitation de ce tutoriel : système windows10, version jquery3.2.1, ordinateur Dell G3.
Dans jquery, le style de position de div est principalement défini via la méthode css() pour modifier la position de div
Créez un nouveau fichier html et nommez-le test.html pour expliquer la modification dynamique de la position jQuery DIV. Créez un module à l'aide de balises div pour modifier dynamiquement sa position à l'aide de la méthode jquery ci-dessous. Définissez l'attribut de classe du div sur mydiv, qui est principalement utilisé pour obtenir l'objet div via cette classe ci-dessous.
Afin de montrer l'effet évident, utilisez CSS pour définir la hauteur et la largeur du div sur 150 px, et la bordure sur une bordure grise unie de 1 px. Créez un bouton à l'aide de la balise bouton, liez l'événement onclick au bouton et exécutez la fonction edit() lorsque vous cliquez sur le bouton.
Dans la balise js, créez la fonction edit(). Dans la fonction, obtenez l'objet div via le nom de la classe et utilisez la méthode css() pour définir la marge gauche-gauche et la marge supérieure-haut pour modifier la position. de la div.
Ouvrez le fichier test.html dans le navigateur, cliquez sur le bouton pour voir l'effet.
Résumé :
1. Créez un fichier test.html.
2. Dans le fichier, utilisez la balise div pour créer un module, et utilisez la balise bouton pour créer un bouton pour déclencher l'exécution de la fonction js.
3. Créez une fonction dans la balise js. Dans la fonction, obtenez l'objet div et utilisez la méthode css() pour définir la marge gauche-gauche et la marge supérieure-haut pour modifier la position du div.
Notes
La méthode css() prend en charge la définition de tous les styles CSS. Plusieurs styles sont séparés par des virgules.
Tutoriels vidéo associés recommandés : Tutoriel vidéo jQuery
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!