nicht angemeldet
Hilfe, IE macht unlogische Fehler
0 0 0 0 0 0
0 0 
Gunnar Bittersmann
Hilfe, IE macht unlogische Fehler
Der MartinHi Leute,
Frust und Verzweiflung macht sich mal wieder wegen dem Internet Explorer breit. Da will ich mich mit Javascript mehr auseinander setzen und will ein Dynamisches Menü schreiben und bekomme wegen IE schon mit dem Grundbaustein Probleme. Bis jetzt kann das Script die Höhe Div-Balken vergrößern und verkleinern. Zudem Speichert es die Ursprungshöhe, um eine wiederherstellung zu gewährleisten. In Webbrowsern funktioniert es Wunderbar. Nur in dem Virus IE natürlich nicht. Er bleibt IMMER bei 19px stehen, egal bei welchen Script- oder Stylesheetänderungen -.-
Naja, ich kann das Problem nur soweit Eingrenzen, dass er die slideIn()-Funktion nicht komplett ausführt. Ich gebe euch einfach mal das komplette Test-project:
HTML-DOKUMENT:
<HTML>
<HEAD>
<LINK rel="stylesheet" type="text/css" href="style.css" />
<SCRIPT type="text/javascript" src="script.js"></SCRIPT>
</HEAD>
<BODY>
<p onClick="getHeight('blubb')">GET HEIGHT</p>
<p id="blubb" onClick="check('blubb')"></p>
<p onClick="getHeight('test')">FUNK 2</p>
<DIV id="test" onClick="check('test')"></DIV>
<p onClick="getHeight('test2')">TEST 2</p>
<DIV id="test2" onClick="check('test2')"></DIV>
</BODY>
</HTML>
CSS-DATEI:
p {
text-decoration:underline;
}
#blubb {
width:100px;
height:100px;
background-color:blue;
}
#test {
width:100px;
height:100px;
background-color:red;
}
#test2 {
width:100px;
height:300px;
background-color:green;
}
JAVASCRIPT-DATEI: [ALSO DER PROBLEMFALL:]
var h = new Array();
var s = new Array();
var stp = 5;
function check(ID) {
alert(document.getElementById(ID).offsetHeight);
}
function getHeight(ID) {
if(s[ID] != "0" && s[ID] != "1") {
h[ID] = document.getElementById(ID).offsetHeight;
s[ID] = "0";
}
if(s[ID] == "0") {
slideIn(ID);
} else {
slideOut(ID);
}
}
function slideIn(ID) {
var obj = document.getElementById(ID).style;
var ht = document.getElementById(ID).offsetHeight;
var tmp = ht -stp;
if(ht <= "0") {
s[ID] = "1";
} else {
ht = "0";
if(tmp >= "0") ht = tmp;
obj.height = ht;
setTimeout("slideIn('"+ID+"')",10);
}
}
function slideOut(ID) {
var obj = document.getElementById(ID).style;
var ht = document.getElementById(ID).offsetHeight;
var tmp = ht + stp;
var oh = h[ID];
if(ht >= oh) {
s[ID] = "0";
} else {
ht = oh;
if(tmp <= oh) ht = tmp;
obj.height = ht;
setTimeout("slideOut('"+ID+"')",10);
}
}
Ok Schuldigung für die lange Ausführung. Aber so habt Ihr wirklich 100% alle Infos. Danke für die Mühe schonmal im Voraus
MFG
Me
-
Hi,
In Webbrowsern funktioniert es Wunderbar. Nur in dem Virus IE natürlich nicht. [...]
Ich gebe euch einfach mal das komplette Test-project:
HTML-DOKUMENT:
<HTML>
<HEAD>
Ich glaube nicht, dass es sich lohnt, sich mit dem Problem eingehender zu beschaeftigen, so lange du nicht mal validen HTML-Code erstellst (der auch nicht den Quirks Mode triggert) - den ein korrektes HTML ist fuer mich Grundvoraussetzung, um darauf mit JavaScript zu operieren. MfG ChrisB -- „This is the author's opinion, not necessarily that of Starbucks.“-
Hi,
In Webbrowsern funktioniert es Wunderbar. Nur in dem Virus IE natürlich nicht. [...]
Ich gebe euch einfach mal das komplette Test-project:
HTML-DOKUMENT:
<HTML>
<HEAD>
> > Ich glaube nicht, dass es sich lohnt, sich mit dem Problem eingehender zu beschaeftigen, so lange du nicht mal validen HTML-Code erstellst (der auch nicht den Quirks Mode triggert) - den ein korrektes HTML ist fuer mich Grundvoraussetzung, um darauf mit JavaScript zu operieren. > > MfG ChrisB ändert auch nichts wenn ich ~~~html <!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">am Anfang dransetze. Ich hoffe weitere Posts geben mir eine Lösung auf mein Problem.
-
Hi,
bitte zitiere vernuenftig.
ändert auch nichts wenn ich
<!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">> am Anfang dransetze. > Ich hoffe weitere Posts geben mir eine Lösung auf mein Problem. 1\. </hilfe/charta.htm#tipps-fuer-fragende> 2\. Welche Debug-Masznahmen hast du bisher unternommen, mit welchem Ergebnis? 3\. Online-Beispiel? (mit validem Code) MfG ChrisB -- „This is the author's opinion, not necessarily that of Starbucks.“-
Eine Seite, auf dem die Dateien liegt findet Ihr unter:
Folgendes habe ich mir Überlegt was das Problem sein könnte:
1. IE führt den setTimeout befehl nur begrenzt aus.
-> FALSCH: da er es sowohl bei einem DIV-TAG mit 100px & einem mit 300px höhe nicht korrekt ausführt
-> FALSCH: erhöhe ich die Zahl, mit der Subtrahiert wird, kommt es immernoch zum gleichen Ergebnis
2. Die Pixelzahl, mit der die höhe subtrahiert wird, ist zu klein.
-> FALSH: erhöhe ich die Zahl, bei einem DIV-TAG mit der höhe 100px, auf 10px oder 100px. Stoppt IE wieder bei 19px.-
Eine Seite, auf dem die Dateien liegt findet Ihr unter:
Wo bleibt die valide Seite? :)
Ich wollte nur noch erwähnt haben, dass es bei mir im FF (3.0.3) keinen direkten "Fade-Effekt" gibt, sondern das Ganze ein wenig nach ein-/ausblenden aussieht.
-
Wo bleibt die valide Seite? :)
Tipp 1: Lies mal die Überschrift zu dem Thread
Tipp 2: Lies dir meinen Anfangspost durchsollte dir das nicht helfen:
Ich hab es mit Firefox, Google Chrome und Internet Explorer(kurz: IE) getestet....NUR der IE hat probleme mit dem Javascript.keinen direkten "Fade-Effekt" gibt, sondern das Ganze ein wenig nach ein-/ausblenden aussieht.
Sorry, mein Fehler. Hatte noch den Wert der Variable stp auf 100 stehen. Habe sie jz korrekt abgeändert
MFG
Me-
Hallo,
Wo bleibt die valide Seite? :)
Tipp 1: Lies mal die Überschrift zu dem Thread
Tipp 2: Lies dir meinen Anfangspost durchdas ändert nichts daran, dass dein verlinktes online-Beispiel nicht valide ist, vor allem nicht einmal eine DOCTYPE-Deklaration hat. Solange du die Browser nach Herzenslust raten lässt, darfst du dich über unlogische Interpretationen nicht beklagen.
Ich hab es mit Firefox, Google Chrome und Internet Explorer(kurz: IE) getestet....NUR der IE hat probleme mit dem Javascript.
Ja, der rät auch gern mal anders als andere Browser.
So long,
Martin--
Denken ist wohl die schwerste Arbeit, die es gibt. Deshalb beschäftigen sich auch nur wenige damit.
(Henry Ford, amerikanischer Industriepionier)-
das ändert nichts daran, dass dein verlinktes online-Beispiel nicht valide ist, vor allem nicht einmal eine DOCTYPE-Deklaration hat. Solange du die Browser nach Herzenslust raten lässt, darfst du dich über unlogische Interpretationen nicht beklagen.
Einleuchtend, leider habe ich nicht viel Erfahrung mit Doctype....besser gesagt: GAR KEINE. Ich habe einiges gegoogelt, ABER leider nichts gefunden, was mir weitergeholfen hätte. Ich wurde nur auf diverse Foren & auf die selfhtml.org Seite, welche doctype erklärt...leider konnte mir das auch nicht wirklich helfen.
Wenn ich die vordefinierten Doctyps von Dreamweaver ausprobiere, verhält sich das JS im IE immernoch gleich und im Firefox & google Chrome funktioniert nur noch die Funktion mit dem einzelnen alert-Befehl.
Wäre cool wenn Ihr mir mit dem Doctype weiterhelfen könntet
-
-
-
-
-
-
-
-
Hi there,
Ok Schuldigung für die lange Ausführung. Aber so habt Ihr wirklich 100% alle Infos. Danke für die Mühe schonmal im Voraus
Ja, Dein Problem hat natürlich weder mit validem Html noch mit Quirksmode zu tun sondern mit dem Umstand, daß der IE Deine farbigen <p> nicht unter die Höhe zusammendrängt, die eine Buchstabenhöhe einnimmt. Das kannst Du daran erkennen, wenn Du bspw. ins Stylesheet bei #test {font-size:0px;} dazuschreibst, dann macht das "grüne"-DIV, was Du möchtest...
-
#test {font-size:0px;} dazuschreibst,
Vielen Dank, das hat enorm weiter geholfen, leider macht er trotz font-size:0px immernoch einen Abstand von 2px
-
Hi there,
#test {font-size:0px;} dazuschreibst,
Vielen Dank, das hat enorm weiter geholfen, leider macht er trotz
font-size:0px immernoch einen Abstand von 2px
Ja, dann schreibst halt noch line-height:0 ins stylesheet und machst in das DIV selbst ein 'rein, dann sollte es funktionieren...
-
Funktioniert einwandfrei. Vielen Dank für deine Hilfe =)
-
-
-
-
@@Me:
<LINK rel="stylesheet" type="text/css" href="style.css" />
Das ist <http://de.selfhtml.org/html/xhtml/unterschiede.htm#leere_elemente@title=kein gültiges HTML>. Siehe http://forum.de.selfhtml.org/archiv/2008/10/t178091/#m1174198
Live long and prosper,
Gunnar--
Erwebsregel 208: Manchmal ist das einzige, was gefährlicher als eine Frage ist, eine Antwort.