Récupération des dimensions d'un div sous Opéra

[Résolu]
Signaler
Messages postés
42
Date d'inscription
vendredi 28 novembre 2003
Statut
Membre
Dernière intervention
18 août 2010
-
Messages postés
42
Date d'inscription
vendredi 28 novembre 2003
Statut
Membre
Dernière intervention
18 août 2010
-
Bonjour

J'ai écris une fonction permettant de récupérer les dimensions d'un élément HTML.
Pour cela, il faut créer un élément avec createElement et le passer en paramètre à la fonction getDimension.
Cette fonction se contente juste d'ajouter l'élément dans le document, de récupérer ses dimensions et de le supprimer.

Exemple d'utilisation :

var spanLibelle = document.createElement("span");
spanLibelle.id = "spanLibelle";
spanLibelle.className = "libelleCategorie";
spanLibelle.innerHTML = "Mon libellé";
var dimensionLibelle = getDimension(spanLibelle);

...

// Objet dimension
function Dimension(width, height){
    this.width = width;
    this.height = height
}

// Méthode de récupération des dimensions d'un élément
function getDimension(element){

    // Affecte un ID par défaut à l'élément s'il n'en a pas
    if (!element.id) element.id = "testDimension";
   
    // Ajoute l'élément au document
    document.body.appendChild(element);
   
    // Récupère les dimensions de l'élément
    var dimension = new Dimension(
            document.getElementById(element.id).offsetWidth,
            document.getElementById(element.id).offsetHeight);
   
    // Supprime l'élément du document
    document.body.removeChild(element);
   
    return dimension;
   
}

Ca marche très bien avec Internet Explorer et Firefox, par contre sous Opéra j'obtiens des dimensions nulles !

Savez-vous pourquoi et comment y remédier ?

Merci de votre aide

4 réponses

Messages postés
42
Date d'inscription
vendredi 28 novembre 2003
Statut
Membre
Dernière intervention
18 août 2010

Salut

Oui, en fait, ma source généralise la sienne qui ne récupère que les dimensions d'un texte.

Le problème que j'avais était que sous Opera, les dimensions d'un texte étaient tout le temps nulles !

J'ai résolu le problème en spécifiant le style "position: absolute" de l'élément passé en paramètre.

A+
Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
18
B
onjour...
voir peut être http://www.javascriptfr.com/codes/RECUPERER-LARGEUR-AFFICHAGE-TEXTE_41737.aspx
mais je ne pense pas avoir bien compris...
;0)
Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
18
B
onsoir...
Merci pour l'info...




Sous Opéra je n'est pas noté de dimensions nulles, peut être qu'Opéra attend la balise de fin de pour autoriser la lecture en absence de positionnement précis.





Pourquoi récupérer les dimensions d'un élément que l'on n'utilise pas, puisque remover du body?




On est bien obligé d'attendre peut être pas la fin du chargement, mais au moins le chargement de la balise , à preuve le document.body.appendChild().









...ma source généralise...


En ce qui concerne la généralisation il me semble qu'il y à
//---------------------------
function Get_Dimension( obj_){
  return([ obj_.offsetWidth, obj_.offsetHeight]);
}

qui fonctionne quelque soit l'objet que l'on passe...





...la sienne qui ne récupère que les dimensions d'un texte...



OUI c'est une demande fréquente lorsque l'on veut calculer par exemple les dimensions d'une bannière.



En ce qui concerne ta fonction
il est inutile d'affecter un ID à l'élément, l'appel à element.offsetWidth et element.offsetHeight étant suffisant...



function getDimension(element){
  document.body.appendChild(element);




  // Récupère les dimensions de l'élément

  var dimension = new Dimension(
    element.offsetWidth,
    element.offsetHeight);




  // Supprime l'élément du document

  document.body.removeChild(element);
  return dimension;
}
Mais je n'ai peut être pas très bien saisi la finalité de tout cela...








;0)
Messages postés
42
Date d'inscription
vendredi 28 novembre 2003
Statut
Membre
Dernière intervention
18 août 2010

Oui, en effet, il n'est pas utile d'affecter un id.
Cela résultait de précédents tests que je faisais :)

Sinon, le but est de pouvoir connaitre la dimension d'objets HTML étant utilisés dans la réalisation de composants javascript.