nicht angemeldet
offsetHeight in dynamisch zugewiesener Klasse ist 0
StruppiHallo Ihrs,
dass man halbwegs zuverlässig über element.offsetWidth die gerenderte Breite bekommt, weiß ich.
Nun ist es so, dass ein <div>-Element eine bestimmte Klasse hatte, per JavaScript dynamisch eine Neue erhalten hat (ist technisch leider vorgegeben), und wenn ich jetzt mit divname.offsetWidth oder -height die entsprechenden Werte auslese, bekomme ich konsequent immer 0 zurück.
Weiß jemand eine Lösung für das Problem? Glasgoogle konnte nicht helfen, habe das Problem einige Male gefunden aber leider keinen Lösungsansatz :(
Grüße, Yasmin
-
Nun ist es so, dass ein <div>-Element eine bestimmte Klasse hatte, per JavaScript dynamisch eine Neue erhalten hat (ist technisch leider vorgegeben), und wenn ich jetzt mit divname.offsetWidth oder -height die entsprechenden Werte auslese, bekomme ich konsequent immer 0 zurück.
ist das Element sichtbar?
Struppi.
--
Javascript ist toll (Perl auch!)-
ist das Element sichtbar?
Struppi.
Hallo Struppi,
jap, das Element ist sichtbar und in der neuen Klasse sind genau wie in der Ursprünglichen Höhe und Breite in Px definiert.
Wenn ich den Style inline anwende, kann ich die Werte danach auslesen, die durch das Stylesheet Vergebenen sowie die nach der dynamischen (neu)Klassenvergabe beide nicht (ausgelesener Wert:0, nicht undefined), obwohl ich sehen kann, dass die Zuweisungen greifen (anhand der Abmessungen).
Es scheint wie gesagt kein triviales Problem zu sein, denn ich bin bei der Suche auf einige gleichartige Fälle gestoßen, bei denen leider ebenfalls kein Lösungsansatz da war.
Irgendwo habe ich etwas von currentStyle gehört, da forsche ich gerade nach, vermute aber, dass es sich da um IE-proprietäre Halbfunktionalitäten handelt ^^.
Grüße, Yasmin
-
jap, das Element ist sichtbar und in der neuen Klasse sind genau wie in der Ursprünglichen Höhe und Breite in Px definiert.
Dann läßt sich die Höhe und Breite auch mit offsetHeight auslesen. Du machst irgend etwas falsch. Nur was? Beispielcode!
Struppi.
--
Javascript ist toll (Perl auch!)-
Beispielcode!
oki hier der essentielle Bereich zum Testen:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<style>
#test2 {
width: 222px;
color: white;
}
.classTest {
width: 333px;
color: white;
}
#test4 {
width: 444px;
color: white;
}
</style>
</head>
<body>
<div id="test1" style="width:111px; color:white;"></div>
<div id="test2"></div> <div id="test3" class="classTest"></div>
<script type="text/javascript">
document.write('<div id="test4" style="color:black;"></div>');var test1 = document.getElementById('test1').style.width;
var test2 = document.getElementById('test2').style.width;
var test3 = document.getElementById('test3').style.width;
var test4 = document.getElementById('test4').style.width;alert(test1 + ', ' + test2 + ', ' + test3 + ', ' + test4);
</script></body>
</html>ergibt bei mir eine alert-Ausgabe von '111px,,,'
Yasmin
-
oki hier der essentielle Bereich zum Testen:
Wo ist in dem offsetWidth?
Struppi.
--
Javascript ist toll (Perl auch!)-
Wo ist in dem offsetWidth?
Struppi.
Ja, ich habe eine schon veränderte Variante geposted. Problem ist, dass der verantwortliche JS-Code ungefähr 30KB lang ist, und ich nicht alleine daran arbeite ^^
Habe gerade eine rudimentäre Testversion erstellt, in der es tadellos funktioniert.
Jetzt muss ich auf Fehlersuche in n-1 Funktionen gehen, danke Dir nochmal!
Yasmin
-
Habe gerade eine rudimentäre Testversion erstellt, in der es tadellos funktioniert.
Was anderes hätte mich auch erstaunt.
Jetzt muss ich auf Fehlersuche in n-1 Funktionen gehen, danke Dir nochmal!
Viel Spaß ;-)
Struppi.
--
Javascript ist toll (Perl auch!)-
Viel Spaß ;-)
Struppi.
Hallo nochmal,
ich konnte das Problem jetzt isolieren. Der Container hatte einen inline-Style mit display:none, das hatte ich übersehen, die 0 ist erklärt.
Beim Testen bin ich aber auf einen anderen Fehler gestoßen:
Hat ein Element einen inline-Style & eine per Stylesheet zugewiesene Klasse, die dann dynamisch überschrieben wird, dann überschreibt die neu zugewiesene Klasse nicht das im inline-Style festgelegte Attribut.
Stylesheet:
.classTest {
width: 333px;
color: white;
}.classTest2{
width:500px;
height:300px;
}HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<style></style>
<link rel="stylesheet" href="style.css" type="text/css">
</head>
<body><div id="test3" class="classTest" style="background-color:red; width:9px;"></div>
<script type="text/javascript">
var test3 = document.getElementById('test3').offsetWidth;
alert(test3);document.getElementById('test3').className='classTest2';
var test3 = document.getElementById('test3').offsetWidth;
alert(test3)</script>
</body>
</html>Nochmal danke für die Hilfe & frohe Ostern,
Yasmin
-
hi,
Beim Testen bin ich aber auf einen anderen Fehler gestoßen:
Sag doch bitte nicht immer "Fehler" ... wenn das Problem wahrscheinlich schon wieder bei dir liegt.
Hat ein Element einen inline-Style & eine per Stylesheet zugewiesene Klasse, die dann dynamisch überschrieben wird, dann überschreibt die neu zugewiesene Klasse nicht das im inline-Style festgelegte Attribut.
Beschäftige dich mit der Spezifität von Selektoren.
gruß,
wahsaga--
/voodoo.css:
#GeorgeWBush { position:absolute; bottom:-6ft; }
-
-
-
-
-
Beispielcode!
... Argh!
da läuft irgendetwas schief ;)
ich muss ein paar Funktionen austesten...
Danke für die Hilfe!
Yasmin
-
-
-
-