Accueil > Forum > > > > Recuperer un style em en javascript
Recuperer un style em en javascript
jeudi 24 avril 2008 à 07:23:22 |
Recuperer un style em en javascript

MATHIS49
|
Bonjour,
j'aimerais recuperer la taille d'un div en Px qui est lui même en Em, J'ai trouvé ce script :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>Untitled Document</title> </head>
<body>
<div id="test" style="width:3em">toto</div> <script type="text/javascript"> function getStyle(oElm, strCssRule){ var strValue = ""; if(document.defaultView && document.defaultView.getComputedStyle){ strValue = document.defaultView.getComputedStyle(oElm, "").getPropertyValue(strCssRule); } else if(oElm.currentStyle){ strCssRule = strCssRule.replace(/\-(\w)/g, function (strMatch, p1){ return p1.toUpperCase(); }); strValue = oElm.currentStyle[strCssRule]; } return strValue; }
alert(getStyle(document.getElementById("test"), "width"));
</script> </body> </html>
Le probleme est que tout marche pour le mieux sur firefox mais sur internet explorer 6, ce stupide navigateur me renvoie la valeur Em. Comment resoudre ce petit tracas ?
Merci !
|
|
jeudi 24 avril 2008 à 09:53:28 |
Re : Recuperer un style em en javascript

bultez
|
Bonjour,
je ne vois pas en quoi ce peut-être stupide de renvoyer "3em",
lorsque c'est ce qu'on écrit dans l'attribut ???
je dirais même que c'est tout à fait normal, légitime, correct...
et tout et tout...
en tout cas c'est ce que fait IE et ça ne me semble pas être une absurdité,
FF lui retourne effectivement cette valeur transformée, et sans porter
aucun jugement sur ce superbe navigateur, je préfère le comportement
de IE...
au moins sur sur ce coup là ! car ce peut-être disons... génant.
en simplifiant l'exemple fourni :
<body>
<div id="test" style="width:3em">toto</div>
<script type="text/javascript">
var d=document.getElementById("test");
alert( d.style.width +"\n"+
d.clientWidth
);
var ie = false; /*@cc_on ie = true; @*/
if ( !ie )
alert( window.getComputedStyle(d,null).width );
else alert( d.currentStyle.width )
</script>
</body>
Cordialement.
|
|
jeudi 24 avril 2008 à 18:25:59 |
Re : Recuperer un style em en javascript

PetoleTeam
|
Bonjour à tous,
| mais sur internet explorer 6, ce stupide navigateur me renvoie la valeur Em |
| il est vrai que ce commentaire est de trop attendu que seul IE, sur ce coup, répond à se qu'on lui demande.
Le fait que mettre la largeur en em présente l'avantage d'avoir le même comportement sur les différents navigateurs l'orsque l'on augmente la taille de la font du DIV
Longueur en em entraîne quelle est relative à la taille de caractère employée par l'élément conteneur. exemple 1.5em = 150% de la taille de caractère définie par l'élément parent.
Mais je m'égare me semble t-il...
Pour connaître la taille en pixel des éléments il y a les incontournables offsetWidth et offsetHeight. exemple : var O_Div = document.getElementById("D_TEST"); var Larg = O_Div.offsetWidth; var Haut = O_Div.offsetHeight; alert( "offset : \nLargeur = " +Larg +"\nHauteur = " +Haut);
ou encore clientWidth et clientHeight. exemple : var O_Div = document.getElementById("D_TEST"); var Larg = O_Div.clientWidth; var Haut = O_Div.clientHeight; alert( "client : \nLargeur = " +Larg +"\nHauteur = " +Haut);
...mais gare à la prise en compte des bordures différentes suivant les navigateurs, beaucoup de polémique à ce sujet d'ailleurs et d'ici.
Pour en revenir à mon égarement du début juste un petit code pour test <html> <head> <script type="text/javascript"> function Show_Info( id_){ var O_Div = document.getElementById( id_); var Larg = O_Div.offsetWidth; var Haut = O_Div.offsetHeight; alert( "offset : \nLargeur = " +Larg +"\nHauteur = " +Haut); var Larg = O_Div.clientWidth; var Haut = O_Div.clientHeight; alert( "client : \nLargeur = " +Larg +"\nHauteur = " +Haut); } </script> </head> <body> <div id = "D_TEST" style = "width:3.0em; font-size:20px; border:1px solid red;">Texte</div> <input type = "button" value="UP Font" onclick = "document.getElementById('D_TEST').style.fontSize='40px';"><br> <input type = "button" value="Show" onclick = "Show_Info('D_TEST');"> </body> </html> encore un test juste pour le FUN, mettez un texte avec des espaces dans le DIV.
;O)
|
|
Cette discussion est classée dans : document, em, strvalue, strcssrule, oelm
Répondre à ce message
Sujets en rapport avec ce message
Compatibilite [ par JB ]
A grand dieu pardonnez moi de mon ignorance ! Plus serieusement, je suisdebutant programmeur (etudiant en BTS d'info, je n'avais que quelques basesde
Récupérer l'adresse d'un document [ par Kariboo ]
Comment récupérer l'adresse du document présent dans la fenêtre principale en exécutant un script EXTERIEUR: Il s'agit en fait d'un script présent dan
Capturer la sélection d'une liste Box [ par OlivierR ]
Bonjour tout le monde !Je suis débutant en JavaScript et je voudrais savoir comment capturer le choix de l'utilisateur d'une liste Box. Sa déclaration
Aide a decrypté [ par Wab ]
bonjour, quelqu'un peux m'aider a decrypté ca? :function getCookieVal (offset) { var endstr = document.cookie.indexOf (";", offset); if (endstr == -
aide pour un jv-sc qui test des champs [ par Moussetique ]
function VerifForm() { adresse = document.krucial.email.value; motdp = document.krucial.mdp.value; var place = adresse.indexOf("@",1); var point = adr
de l aide please [ par ibompuis ]
voila je souhaiterais afficher dans plusieurs tableaux des images que je pourrai recharger avec un boutonj ai trouve ce script mais je ne sais pas co
Cases à cocher [ par lavache13 ]
Je suis en train de faire un formulaire avec des cases à cocher et j'aimerai savoir ce que retourne une case à cocher comme valeur. J'ai essayé checke
Je ne comprends pas [ par Robbie ]
Salut, j'ai un formulaire dans ce formulaire j'ai une liste déroulante : avec function liste_changee(){ document.formulaire.metho
JavaScript utilisée dans PHP [ par Chinatraveler ]
BonjourDans une même page *.php mêlant PHP et javascript, je souhaite utiliser l'objet "document.referrer" dans une condition "if" PHP.Est-ce possible
Passage de variable entre fenetres... [ par baddack ]
J'ai deux fentres et je veux envoyer des infos de l'une a l'autre!!Par exemple si je click sur un lien de la fenetre1, appeler une fonction du genre :
Livres en rapport
|
Derniers Blogs
[RIA SERVICES] INCLUDE ET DOMAINDATASOURCE[RIA SERVICES] INCLUDE ET DOMAINDATASOURCE par Audrey
Dans un de mes articles précédents , j'avais parlé des DomainDataSource avec RIA Services dans le cas d'une interface Maître - Détail. Dans le même principe, je vais parler d'une autre manière de mettre en forme ce cas d'interface avec RIA Services. Et po...
Cliquez pour lire la suite de l'article par Audrey ZUNE : VERSION ZUNE SOFTWARE V 4.2 ET LA SOCIALISATIONZUNE : VERSION ZUNE SOFTWARE V 4.2 ET LA SOCIALISATION par ROMELARD Fabrice
Une des nouveautés de la version V 3.0 était l'apparition de l'onglet Social qui ne fonctionnait que si le MarketPlace était activé sur son poste. Cela limitait donc son intérêt, car hors du cadre commercial USA-CANADA, peu de monde trouva...
Cliquez pour lire la suite de l'article par ROMELARD Fabrice PRATIQUE DE SILVERLIGHT PAR ERIC AMBROSIPRATIQUE DE SILVERLIGHT PAR ERIC AMBROSI par MPOWARE
Je viens de finir la lecture du dernier livre d'
Eric Ambrosi
éditions PEARSON
Son livre donne une approche pratique de Silverlight qui sera aussi bien comprise par le développeur que par le designeur.
Tous les aspects du développement RIA sont abor...
Cliquez pour lire la suite de l'article par MPOWARE APPRENDRE à DéVELOPPER POUR LES MOBILES AVEC LA NOUVELLE GéNéRATION .NETAPPRENDRE à DéVELOPPER POUR LES MOBILES AVEC LA NOUVELLE GéNéRATION .NET par odewit
2 déclinaisons de Silverlight et 2 déclinaisons de Mono permettent dorénavant (ou permettront prochainement) de développer des applications .NET mobiles pour les principales plates-formes du marché :
Silverlight pour Symbian, basé sur Silverlight 2...
Cliquez pour lire la suite de l'article par odewit ZUNE : NOUVELLE VERSION DU ZUNE SOFTWARE - V 4.2ZUNE : NOUVELLE VERSION DU ZUNE SOFTWARE - V 4.2 par ROMELARD Fabrice
Avec la dernière génération du lecteur MP3 de Microsoft, le ZUNE HD, Microsoft a publié une nouvelle version du logiciel pour PC. Ainsi, je me suis décidé à installer celle-ci sur mon Tablet PC ACER, comme toujours le logiciel est donc tél...
Cliquez pour lire la suite de l'article par ROMELARD Fabrice
Forum
RE : CONVERSIONRE : CONVERSION par peter2010
Cliquez pour lire la suite par peter2010
Logiciels
Academy System (10.9.4.0)ACADEMY SYSTEM (10.9.4.0)Logiciel de gestion des établissements.
- élèves/étudiants (inscription, dossier, absence...)
-... Cliquez pour télécharger Academy System Xilisoft Convertisseur Vidéo Ultimate (5.1.39.0305)XILISOFT CONVERTISSEUR VIDéO ULTIMATE (5.1.39.0305)Xilisoft Convertisseur Vidéo Ultimate est un outil puissant de conversion vidéo, facile à utilise... Cliquez pour télécharger Xilisoft Convertisseur Vidéo Ultimate Xilisoft DVD Ripper Ultimate (5.0.64.0304)XILISOFT DVD RIPPER ULTIMATE (5.0.64.0304)Xilisoft DVD Ripper Ultimate est un logiciel excellent pour copier et convertir DVD vers presque ... Cliquez pour télécharger Xilisoft DVD Ripper Ultimate Rigs of Rods (63.3)RIGS OF RODS (63.3)c'est un jeu de multi-simulation camions,autobus voitures, avions, bateaux, hélicoptère avec défo... Cliquez pour télécharger Rigs of Rods
|