Maison > interface Web > tutoriel CSS > Comment puis-je obtenir la largeur d'un élément dans jQuery, même si elle est définie en pourcentage ?

Comment puis-je obtenir la largeur d'un élément dans jQuery, même si elle est définie en pourcentage ?

Susan Sarandon
Libérer: 2024-11-26 10:53:09
original
870 Les gens l'ont consulté

How Can I Get an Element's Width in jQuery, Even If Defined as a Percentage?

Détermination de la largeur d'un élément dans jQuery : pourcentage par rapport aux pixels

Dans le domaine du développement Web, il est souvent nécessaire de déterminer la largeur d'un élément. Cependant, les méthodes .width() ou .css('width') de jQuery renvoient généralement la largeur exacte des pixels, même si le développeur l'a définie en utilisant une valeur de pourcentage en CSS.

Détermination de la largeur en fonction de la définition CSS

Détermination de la largeur en fonction de la définition CSS

    Pour résoudre ce problème, il faut calculer soi-même la largeur. Les étapes suivantes montrent comment :
  1. Récupérer la largeur de l'élément à l'aide de .width() : var width = $('#someElt').width();
  2. Obtenir la largeur de le parent de l'élément : var parentWidth = $('#someElt').offsetParent().width();
Calculez la largeur en pourcentage : var percent = 100 * width / parentWidth;

En suivant ces étapes, vous pouvez déterminer avec précision la largeur d'un élément en pixels ou en pourcentage, en fonction de sa définition CSS. Ces connaissances s'avèrent inestimables pour développer des plugins jQuery ou effectuer divers calculs de mise en page.

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!

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal