[JS] getComputedStyle retourneert 'auto' ipv '...px'

[Verwijderd]

Ik heb me helemaal de pleuris gezocht, maar kom er niet uit. Een korte samenvatting van al mijn zoekresultaten zie je hieronder:

Cascading Stylesheet:

li {
   width:auto;
}

JavaScript:

var obj = document.getElementsByTagName("li")[0];

alert(obj.style.width); // "" (empty string)
alert(obj.offsetWidth); // 0
alert(obj.style.pixelWidth); // FF=undefined, IE=0
alert(getComputedStyle(obj,null).offsetWidth); // FF=undefined IE=error
alert(getComputedStyle(obj,null).getPropertyValue("width")); // FF=auto IE=error

En nog vele variaties hierop. Punt blijft dat niets werkt. Uiteindelijk had ik een combinatie gevonden die wel in beide browsers werkte, maar ook die gaf 'auto' terug, terwijl ik het aantal pixels zou willen weten dat de browser er uiteindelijk van heeft gemaakt....

Logischerwijs zou dit dan getComputedStyle(obj, null).getPropertyValue("width") moeten zijn, maar zoals aangegeven geeft ook die niet de juiste waarde terug.

[Clay]

Computed styles zijn de waardes die via css aan een bepaalde property hangen. Als je auto op een li zet ga je dan ook auto terugkrijgen, en niet de naar px omgerekende waarde. Zonder er een op te geven geeft line-height bv ook "normal" terug.

Je moet de obj.offsetWidth dus toch hebben. Die geeft 0 terug omdat je het misschien te vroeg aanroept, of het element in kwestie hidden is.

[Bozozo]

offsetWidth zou inderdaad moeten werken.

Dit soort dingen (met css) zijn ook vervelend met bijvoorbeeld kleuren. Als je de kleur 'black' instelt krijg je ook 'black' terug, en niet #000000. Dat maakt verwerken soms lastig (in dit geval zijn er gelukkig kleuren 'parser' functies beschikbaar).

[Verwijderd]

offsetWidth is wel effe iets anders dan css width, borders en paddings enzo...

[Borizz]

Wat je waarschijnlijk nodig hebt is: http://www.quirksmode.org/dom/w3c_cssom.html#elementview .

[Verwijderd]

Clay schreef op zaterdag 31 mei 2008 @ 17:16:
Computed styles zijn de waardes die via css aan een bepaalde property hangen. Als je auto op een li zet ga je dan ook auto terugkrijgen, en niet de naar px omgerekende waarde. Zonder er een op te geven geeft line-height bv ook "normal" terug.

Je moet de obj.offsetWidth dus toch hebben. Die geeft 0 terug omdat je het misschien te vroeg aanroept, of het element in kwestie hidden is.

De JavaScript-functie wordt aangeroepen vanuit een body onload. Zou dan toch goed moeten zijn lijkt me?

De firstChild van elke UL is wel hidden, maar al zijn Siblings niet. Ik heb uitsluitend op de niet-hidden LI's getest.

[Bozozo]

Zet anders even een testpagina online...

[ Voor 90% gewijzigd door Bozozo op 01-06-2008 22:35 ]