IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

HTML Discussion :

[casse-tete (pour moi)] recuperer la largeur d'un <div>


Sujet :

HTML

  1. #1
    Invité
    Invité(e)
    Par défaut [casse-tete (pour moi)] recuperer la largeur d'un <div>
    salut tout le monde !

    voila, j'ai un <div> dont je connais la propriété style.left
    dedans j'ai du texte qui peut etre dans n'importe quelle police et n'importe quelle taille.

    je cherche la largeur de ce <div> :
    - j'ai pensé multiplier la largeur des caracteres de la police par le nombre de caracteres, mais je n'arrive pas à connaitre la largeur des caracteres ... ==> s'il y a un moyen, quel est-il :
    - j'ai pensé passer par la propriete width de la balise directement, mais comme je ne le defini pas à l'avance, il me sort 'undefined'

    d'autres idées :

  2. #2
    Nouveau membre du Club
    Inscrit en
    Juin 2004
    Messages
    26
    Détails du profil
    Informations forums :
    Inscription : Juin 2004
    Messages : 26
    Points : 29
    Points
    29
    Par défaut
    salut,

    moi j'ai ça :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    <script type="text/javascript">
    function look(){
    var oX = document.getElementById('cont');
    if( !oX ) { return false; }
    var W = oX.clip ? oX.clip.width : oX.offsetWidth;
    alert(W);
    } 
    </script>
    </script>
    </head>
    <body>
    <br>
    <div id="cont" style="border:1px solid blue;" onClick="look();">
    ici je vais mettre un peu de texte<br>
    juste pour combler le vide du div<br>
    </div>
    </body>
    </html>
    mais vu que la largeur n'est pas definie , elle fait 100% de la page ...

    j'espere que tu pourras tout de même en tirer quelque chose .

    L.

  3. #3
    Futur Membre du Club
    Profil pro
    Inscrit en
    Avril 2003
    Messages
    7
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Avril 2003
    Messages : 7
    Points : 8
    Points
    8
    Par défaut Re: [casse-tete (pour moi)] recuperer la largeur d'un <di
    Citation Envoyé par torvalds17
    - j'ai pensé multiplier la largeur des caracteres de la police par le nombre de caracteres, mais je n'arrive pas à connaitre la largeur des caracteres ... ==> s'il y a un moyen, quel est-il :
    Tu ne peux pas connaître la largeur moyenne d'un caractère, sachant qu'un m est plus large qu'un i par exemple. La seule solution serait d'utiliser des polices à largeur fixe, ceci dit, même ainsi, ce serait du bricolage bon marché très peu fiable... Il y a une autre solution...


    Citation Envoyé par torvalds17
    - j'ai pensé passer par la propriete width de la balise directement, mais comme je ne le defini pas à l'avance, il me sort 'undefined'
    La propriété width ne va pas en effet t'être d'un grand secours dans le cas d'une div dont la largeur n'est pas fixée à l'avance. Mais il y en a une qui répond exactement à tes besoins : offsetWidth.

    Cette propriété JS te donne la largeur de ta div, scrollbar comprise si il y en a une. Si tu veux la largeur sans tenir compte de la scroolbar, utilise la propriété scrollWidth. Les résultats sont donnés en pixels (à confirmer).

    Par contre, en ce qui concerne la compatibilité, je ne suis pas certain que ça passe sous tous les navigateurs. Je viens d'essayer avec IE 5 et Mozilla 1.6, ça passe. Mais il faudrait se renseigner sur les autres navigateurs. Si tu as des réponses à ce sujet, n'hésite pas à nous les communiquer.

    Note : pour ceux que ça intéresse, on peut aussi récupérer les hauteurs grâce aux propriétés offsetHeight et scrollHeight

  4. #4
    Invité
    Invité(e)
    Par défaut
    merci, offsetWidth fonctionne parafaitement (je precise juste, au cas où ça interesserait quelqu'un, que cette propriete ne fonctionne que si le style.disqplay du <div> n'est pas à 'none' ).

    ps : au niveau compatibilité, je m'en occuperai plus tard, car pour l'instant je ne teste mon script que sous FireFox, on verra le reste apres.

    encore

  5. #5
    Nouveau membre du Club
    Inscrit en
    Juin 2004
    Messages
    26
    Détails du profil
    Informations forums :
    Inscription : Juin 2004
    Messages : 26
    Points : 29
    Points
    29
    Par défaut
    re,

    offsetWidth fonctionne à peu pres sur tout .
    (testé I.E, netsc.6 et 7 , firefox.0.9.2 , mozilla.1.0 , opera.7.54).

    pas trouvé à qui s'adressait clip.width ... je l'ai laissé car je trouvais que ça faisait joli .

    L.

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. Réponses: 20
    Dernier message: 02/02/2008, 22h14
  2. Requête un peu trop compliqué pour moi
    Par Kokito dans le forum Langage SQL
    Réponses: 5
    Dernier message: 18/04/2005, 15h17
  3. Réponses: 1
    Dernier message: 02/02/2005, 19h34
  4. casse tete de requete
    Par moutey dans le forum Langage SQL
    Réponses: 2
    Dernier message: 14/12/2004, 14h00
  5. [KNOPPIX] Linux pour la récupération de données
    Par manunu dans le forum Autres
    Réponses: 8
    Dernier message: 06/05/2004, 12h30

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo