nicht angemeldet
DHTML-Menu funktiniert im IE-Quirksmode nicht
Hi,
ich habe ein DHTML-Menu geschrieben, welches mit den meisten gängingen Browsern, die ich kenne, funktioniert:
Opera ab 5
Mozilla, Firefox,
IE 6
ja sogar Netscape 4 ! (*stolz sei*).
Konqueror glaub ich auch..
Nur es gibt seltsamerweise das Problem, dass es im IE-Quirksmode nicht funktioniert, also weder im IE 5 noch IE 5.5. (hab ich lange gebraucht um herauszukriegen, dass es was damit zu tun hat). IE 4 konnte ich nicht testen, ist aber auch egal...
Das Menu findet ihr hier:
< http://www.abi01-wrg.de/menu/menu.html>
Ihr braucht/sollt euch natürlich nicht den Code ansehen, da blickt ihr eh nicht durch, schätze ich (für den Code habe ich mehrere Monate geschrieben und getestet). Sondern vielleicht habt ihr eine Idee, was der IE im Quirks-Mode anders macht.
Wenn ich den IE 6 in den Quirksmode schalte, dann ist es auch aus. Dadurch hab ich den Fehler auch gefunden.
Es scheint m.E. etwas mit der Visibility Eigenschaft zu tun zu haben.
Problem ist, dass die Untermenus nicht angezeigt werden, beim hover.
IE 5.x kann man auch nicht in den Standardmode versetzen per JavaScript oder?
Vielen Dank für hilfe!
Gruß
Christian
-
hallo Christian,
Ihr braucht/sollt euch natürlich nicht den Code ansehen, da blickt ihr eh nicht durch
pfffff ... du traust dich was. Hier im Forum gibts nur und ausschließlich "Code-Durchblicker", wer keinen Code anschaut, schreibt dir eh nix Gescheites zurück. Es geht ganz im Gegensatz zu deiner Meinung eben genau darum, was dein Code eventuell falsch macht.
vielleicht habt ihr eine Idee, was der IE im Quirks-Mode anders macht.
Vieles.
Es scheint m.E. etwas mit der Visibility Eigenschaft zu tun zu haben.
Und in welcher von deinen drei Javascript-Dateien steckt das?
Problem ist, dass die Untermenus nicht angezeigt werden, beim hover.
Läßt sich mit IE 5.0, 5.5 und 6.0 nicht nachvollziehen.
IE 5.x kann man auch nicht in den Standardmode versetzen per JavaScript oder?
Äh - naja, wenn du so fragst: _wie_ hast du ihn denn überhaupt in den Quirks-Mode gebracht und was verstehst du darunter?
Grüße aus Berlin
Christoph S.
--
mailto:christoph.schnauss@berlin.de
http://www.christoph-schnauss.de
ss:| zu:) ls:& fo:) va:) sh:| rl:|
-
Hi,
pfffff ... du traust dich was. Hier im Forum gibts nur und ausschließlich "Code-Durchblicker", wer keinen Code anschaut, schreibt dir eh nix Gescheites zurück. Es geht ganz im Gegensatz zu deiner Meinung eben genau darum, was dein Code eventuell falsch macht.
Ich wollte eigentlich nur damit sagen, dass ich mit diesem Post es nicht erwarte, dass sich jemand durch den vielen Code wühlt, da das ja doch etwas viel verlangt ist.
Der Code an sich ist aber ok (syntaktisch und so).Es scheint m.E. etwas mit der Visibility Eigenschaft zu tun zu haben.
Und in welcher von deinen drei Javascript-Dateien steckt das?
Also hier ganz unten steht das CSS was erzeugt wird: (in createCSS)
< http://www.abi01-wrg.de/menu/menu_def.js>
Hier wird das Menu erzeugt (ganz unten wieder) und die Funktionalität bereit gestellt:
< http://www.abi01-wrg.de/menu/menu.js>
Diese wird im <head> eingebunden.Ein Menu sieht etwa so aus:
<div id="menu1"><div id="menu1Item1">
<div id="menu1spanItem1">text</div>
<div id="menu1spanItemHover1">test</div>
</div><div id="menu1Item1">
<div id="menu1spanItem1">text</div>
<div id="menu1spanItemHover1">test</div>
</div>...
</div>Wir dann alle per CSS und JS positioniert.
Problem ist, dass die Untermenus nicht angezeigt werden, beim hover.
Läßt sich mit IE 5.0, 5.5 und 6.0 nicht nachvollziehen.
:o !?
D.h. bei dir klappts im IE 5.x?? Seltsam.Äh - naja, wenn du so fragst: _wie_ hast du ihn denn überhaupt in den Quirks-Mode gebracht und was verstehst du darunter?
IE 5.x ist doch autotaisch im Quirksmode, oder? Also er kennt doch gar keinen Standardmode.
IE 6 hab ich durch den Doctype switch in den Quirksmode gebracht, und dann entstand da auch der Fehler.Es wär vielleicht mal gut zu wissen, ob der Quirksmode nur CSS beeinflusst, oder auch JavaScript, wie z.B. style.visibility="visible".
Scheint wohl irgendwie ein Render Bug zu sein!?
Gruß
Christian-
Hi,
Es wär vielleicht mal gut zu wissen, ob der Quirksmode nur CSS beeinflusst, oder auch JavaScript
Ja. Es gibt hier einige wenige Unterschiede, die sich aber fatal auswirken, so daß z.B. eine Eigenschaft anders abgefragt oder gesetzt werden muß. Du könntest die Rückgabewerte Deiner Funktionen prüfen, um die Ursache einzugrenzen.
Als Lösung könntest Du dann z.B. über document.compatMode zur jeweils passenden Methode verzweigen.Übrigens mal grundsätzlich zu Deinem Menü: Es hat den Mangel, daß ein weniger versierter User diagonal platzierte Unterpunkte auch versucht, schräg anzusteuern - was aber nicht funktioniert, da das den Event auslösende Element dabei verlassen wird. Somit werden solche Menüpunkte selbst bei aktiviertem Javascript nicht für jeden erreichbar sein.
freundliche Grüße
Ingo-
Hi,
Ja. Es gibt hier einige wenige Unterschiede, die sich aber fatal auswirken, so daß z.B. eine Eigenschaft anders abgefragt oder gesetzt werden muß. Du könntest die Rückgabewerte Deiner Funktionen prüfen, um die Ursache einzugrenzen.
Hm. dann werd ich wohl mal in meine createCSS reinschauen müssen...
Das komische ist aber noch, dass das Hauptmenu ja angezeigt wird, obwohl es exact dasselbe CSS benutzt, außer eben, dass es auf visible gestellt ist.
Als Lösung könntest Du dann z.B. über document.compatMode zur jeweils passenden Methode verzweigen.
Ja. Genau.
Übrigens mal grundsätzlich zu Deinem Menü: Es hat den Mangel, daß ein weniger versierter User diagonal platzierte Unterpunkte auch versucht, schräg anzusteuern - was aber nicht funktioniert, da das den Event auslösende Element dabei verlassen wird. Somit werden solche Menüpunkte selbst bei aktiviertem Javascript nicht für jeden erreichbar sein.
Hm, naja, ist mir nie so aufgefallen. Der User kann sich dann halt mal anstrengen.
Aber ne einfache Lösung wäre, einen Timer zu setzen, und beim mouseover erst nach einer kurzen Zeit das neue Untermenu aufzurufen.Aber so schlimm finde ich den Fehler nicht. Viel mehr dass das Ganze nicht unter IE 5.x läuft :-( .
Gruß
Christian-
Hi,
Das komische ist aber noch, dass das Hauptmenu ja angezeigt wird, obwohl es exact dasselbe CSS benutzt, außer eben, dass es auf visible gestellt ist.
kann auch an einem CSS-Bug liegen, gegen den vielleicht eine zusätzliche Änderung der Hintergrundfarbe oder eines bordr helfen könnte.
Übrigens mal grundsätzlich zu Deinem Menü: Es hat den Mangel, daß ein weniger versierter User diagonal platzierte Unterpunkte auch versucht, schräg anzusteuern - was aber nicht funktioniert, da das den Event auslösende Element dabei verlassen wird. Somit werden solche Menüpunkte selbst bei aktiviertem Javascript nicht für jeden erreichbar sein.
Hm, naja, ist mir nie so aufgefallen. Der User kann sich dann halt mal anstrengen.
Wenn Du meinst... Kürzlich erst selbst beobachtet:
"Das funktioniert nicht! Wenn ich da hin will, verschwindet das einfach wieder!?!"
[Die Maus steuert das rote X an]Alleine den potentielle Verlust eines Kunden deswegen finde ich schon nicht tragbar.
Aber ne einfache Lösung wäre, einen Timer zu setzen, und beim mouseover erst nach einer kurzen Zeit das neue Untermenu aufzurufen.
Nein. Wie ich sehe, hast Du das eingebaut. Funktioniert aber nicht, wenn die Maus auf dem Weg einen weiteren Menüpunkt der aktuellen Ebene überfährt.
Aber so schlimm finde ich den Fehler nicht. Viel mehr dass das Ganze nicht unter IE 5.x läuft :-( .
Ich schon. Davon abgesehen ist Dein Menü so winzig, daß viele ihre Schrift vergrößern müssen. Und dann wird es auch unbrauchbar.
freundliche Grüße
Ingo-
Hi,
Juhu es funktioniert im IE 5.x
Fehler war: Der IE 5.x hatte eingentlich fast alles richtig gemacht, nur hatte es im negativen Bereich positioniert.
Die Position berechne ich nämlich aus der Fenstergröße u.a. und irgendwie hat der IE diese auf 0 gesetzt.Wisst ihr vielleicht woran es liegt?
Habe im <head> bereich eine Funktion, die die Fenstergröße ermittelt:
function getInnerHeight()
{
var iHeight = window.innerHeight;
if(browser.ie)
{
iHeight = window.document.body.clientHeight;
}
return iHeight;
}Und irgendwie scheint der das dann nicht mitzukriegen.
Schreibe ich im Menu-Skript direkt document.body.clientHeight statt getInnerHeight(), dann hat er die richtige Fensterhöhe.
Mit der Breite hab ich es analog gemacht, da gehts.Idee? Liegts daran, dass die Höhe des Body 0 ist, weil ich nur absolute Elemente im <body> hab?
Alleine den potentielle Verlust eines Kunden deswegen finde ich schon nicht tragbar.
Naja, der Kunde soll sich mal nicht so anstellen, das Menu funktioniert ja prinzipiell.
Aber ne einfache Lösung wäre, einen Timer zu setzen, und beim mouseover erst nach einer kurzen Zeit das neue Untermenu aufzurufen.
Nein. Wie ich sehe, hast Du das eingebaut. Funktioniert aber nicht, wenn die Maus auf dem Weg einen weiteren Menüpunkt der aktuellen Ebene überfährt.Ich hatte es nicht eingebaut, jetzt aber! Ist nur noch nicht ganz optimal... hab ich nur schnell gemacht, um zu zeigen das es geht:
< http://www.abi01-wrg.de/menu/menu.html>Erst nach 1 Sek wird das Untermenu gestartet.
Ich schon. Davon abgesehen ist Dein Menü so winzig, daß viele ihre Schrift vergrößern müssen. Und dann wird es auch unbrauchbar.
Also die Schriftgröße und so lässt sich ja nun wirklich mit Leichtigkeit schnell anpassen (Im Skript). Das solltest du doch wissen.
Das sind Sachen, die nicht zur Grundfunktionalität gehören. Erstmal muss das Menu funktionieren, dann kann ich mich um die Feinheiten kümmern.Gruß
Christian-
Hi,
Wisst ihr vielleicht woran es liegt?
daran:
if(browser.ie)
{
iHeight = window.document.body.clientHeight;im standardkompatiblen Modus mußt Du window.document.documentElement.clientHeight angeben.
Alleine den potentielle Verlust eines Kunden deswegen finde ich schon nicht tragbar.
Naja, der Kunde soll sich mal nicht so anstellen, das Menu funktioniert ja prinzipiell.
nö, der wird sich auch nicht anstellen sondern zur Konkurenz gehen.
Ich hatte es nicht eingebaut, jetzt aber! Ist nur noch nicht ganz optimal... hab ich nur schnell gemacht, um zu zeigen das es geht:
http://www.abi01-wrg.de/menu/menu.html
Erst nach 1 Sek wird das Untermenu gestartet.geht zwar (wenn auch noch ein Aufflackern drin ist), ist aber viel zu langsam. Und wenn Du's beschleunigst, reicht es für manche ncht mehr aus. Eigentlich unlösbar.
Also die Schriftgröße und so lässt sich ja nun wirklich mit Leichtigkeit schnell anpassen (Im Skript). Das solltest du doch wissen.
Ich rede von der im Browser angegebenen Schriftgröße - die kann Dir das Menü komplett zerbröseln.
freundliche Grüße
Ingo-
Hi,
im standardkompatiblen Modus mußt Du window.document.documentElement.clientHeight angeben.
Stimmt. danke. Jetzt klappts wohl nicht mehr im IE 6. Aber das Problem war anders rum:
IE 5: gebe ich document.body.clientHeight direkt im Skript an (da wo es gebraucht wird) dann klappts. Gebe ich es in einer Funktion im head an, dann klappts nicht.
IE 6 (standard mode): Gebe ich document.body.clientHeight (body!!) in der Funktion im Head an, dann klappts, gebe ich es direkt an, klappts nicht. Das Problem lässt sich dann wohl mit document.documentElement lösen.
Aber das IE 5 Problem? Da muss ich ja body nehmen, da kein Standardmode.
nö, der wird sich auch nicht anstellen sondern zur Konkurenz gehen.
Also wir reden doch jetzt von solchen Kunden, denen man z.B. eine Webseite mit hier dem Menu erstellt? Ich glaube kaum, wegen solch einer Kleinigkeit, wird er nicht gleich wechseln.
Oder redest du von Kunden, die mein Menu kaufen wollen? Glaub ich eigentlich weniger.
Das Menu möchte ich auch derzeit nicht öffentlich einsetzen, sondern ist nur so ein nettes Skript, was mir sehr viel Spaß macht, wo ich mich austoben kann, und anschließend drüber freue, wenn es klappt.
Ich rede von der im Browser angegebenen Schriftgröße - die kann Dir das Menü komplett zerbröseln.
Man kann angeben, wie breit die Menu Punkte sind. Die sind meistens auf 100px gesetzt. Das will ich aber noch umstellen, dass das Skript automatisch in einem Menu den breitesten sucht, und alle anderen auf diese Breite setzt. Dann sollte das auch gelöst sein.
Gruß
Christian-
Hi,
Stimmt. danke. Jetzt klappts wohl nicht mehr im IE 6.
Du mußt halt die Eigenschaften oder den CompatMode vorher abfragen.
nö, der wird sich auch nicht anstellen sondern zur Konkurenz gehen.
Also wir reden doch jetzt von solchen Kunden, denen man z.B. eine Webseite mit hier dem Menu erstellt? Ich glaube kaum, wegen solch einer Kleinigkeit, wird er nicht gleich wechseln.Nein, von potentiellen Kunden des Kunden, sofern er das Menü auf einer kommerziellen Seite nutzt. Aber das betrifft jetzt nicht nur Dein Menü, sondern alle dieser Art.
Man kann angeben, wie breit die Menu Punkte sind. Die sind meistens auf 100px gesetzt. Das will ich aber noch umstellen, dass das Skript automatisch in einem Menu den breitesten sucht, und alle anderen auf diese Breite setzt. Dann sollte das auch gelöst sein.
Aber die Höhe macht weitaus größere Probleme. em-Werte - auch für die Positionierungen - könnten evtl. helfen.
freundliche Grüße
Ingo-
Hi,
Aber die Höhe macht weitaus größere Probleme. em-Werte - auch für die Positionierungen - könnten evtl. helfen.
Hm, also die Höhe und Breite wird mittels offsetWidth /offsetHeight ermittelt, und das gibt nun mal die Breite des Elements in Pixeln an.
An Hand der Breite des ersten Menupunkts, wird dann z.B. der zweite positioniert. Absolute Positionierung war besser, bzw. auch notwendig (u.a. auch wegen NS4).Alle Elemente, also auch die Menupunkte, werden absolut positioniert.
Der erst Menupunkt hat left:0px, top: 0px, der zweite hat
left: BreitedeserstenMenupunks px, top 0px (bei horizontalem Menu).Von daher kann ich wohl schlecht em benutzen.
Positionierung geschieht also autoamisch, anhand von Pixelwerten.
Für feste Breiten, kann man natürlich em nehmen.
Und die Höhe wird eigentlich immer automatisch berechnet (offsetHeight).Problem ist auch eigentlich nur, wenn man die Seite geladen hat, und dann die schriftgröße verändert. Das Menu ist halt dann noch anhand der alten Größen positioniert. Da hilft dann nur ein Neuladen.
Aber anders kann man das wohl nicht lösen. Man kann ja kein Event losschicken, wenn der Benutzer die Schriftgröße ändert.Gruß
Christian-
Hi,
Hm, also die Höhe und Breite wird mittels offsetWidth /offsetHeight ermittelt, und das gibt nun mal die Breite des Elements in Pixeln an.
Ja - aber Du kannst diese Daten bei jeder Aktion erneut abfragen.
Der erst Menupunkt hat left:0px, top: 0px, der zweite hat
left: BreitedeserstenMenupunks px, top 0px (bei horizontalem Menu).Es sollte reichen, alle Menüpunkte in ein abnsolute positioniertes DIV zu stecken. Die Positionen der einzelnen Punkte solltest Du auch so ermitteln können.
Von daher kann ich wohl schlecht em benutzen.
Dann vermutlich schon.
Problem ist auch eigentlich nur, wenn man die Seite geladen hat, und dann die schriftgröße verändert. Das Menu ist halt dann noch anhand der alten Größen positioniert. Da hilft dann nur ein Neuladen.
Stimmt, habe ich gerade ausprobiert. Nur die roten Pfeile sind dann über dem Text.
Aber anders kann man das wohl nicht lösen. Man kann ja kein Event losschicken, wenn der Benutzer die Schriftgröße ändert.
Du kannst aber bei jeder Menüaktion prüfen, ob sich etwas verändert hat und ggfls. das Menü neu aufbauen. IMO besser, als zu erwarten, daß ein User auf die Idee kommt, die Seite neu zu laden.
freundliche Grüße
Ingo
-
-
-
-
-
-
-
-
-
-