Dropdown Menü in Firefox
Grolli
- browser
0 ChrisB0 Sander0 Der Martin0 Grolli0 Ingo Turski0 Grolli
0 Gunnar Bittersmann
Hallo,
Nach langem Suchen im Netz würde ich gerne mal eine Frage in den Raum werfen. Ich habe das Problem, dass mein Dropdownmenü in IE und Opera geht aber im Firefox sich nicht öffnet. Jetzt hab ich gelesen, dass es scheinbar vielen so geht. Leider konnte ich die Lösungen im Netz nicht auf mein Menü anwenden. Heisst haben nicht geklappt.
Daher mal die Frage an euch wissenden wo der Fehler liegen kann.
Hier mal ein Beispiel
http://www.weltfussballarchiv.com/Vereinsprofilnew.php?ID=3886
Bei IE und Opera geht das Menü wunderbar. Beim Firefox reagiert es nichtmal. Kann das an einer Einstellung in der css-datei liegen?
die css-Datei dafür http://www.weltfussballarchiv.com/css/main.css
oder eher in meiner Javascript-Datei (http://www.weltfussballarchiv.com/js/common.js) was ich aber eher nicht denke.
Ich hoffe ihr könnt mir weiterhelfen.
Hi,
Hier mal ein Beispiel
http://www.weltfussballarchiv.com/Vereinsprofilnew.php?ID=3886
Das strotzt vor Fehlern - beseitigen, dann kann man weitersehen.
MfG ChrisB
Hi,
Hier mal ein Beispiel
http://www.weltfussballarchiv.com/Vereinsprofilnew.php?ID=3886
Das strotzt vor Fehlern - beseitigen, dann kann man weitersehen.
MfG ChrisB
Deswegen kann man ja trotzdem versuchen, zu helfen.
Ich hab mir das grad mal kurz angesehen, scheinbar bindest du nur eine sehr kleine js-datei ein, über die das menu erzeugt wird, diese common.js - ich glaub mit den paar zeilen da drin bekommt man schwer echte cross-browser kompatibilität hin.
es fängt an mit
document.getElementById("nav").getElementsByTagName("LI");
erstmal hab ich sowas noch nie gesehen, das von einem element, was man per "getElementByBlaBla" bekommt, gleich nochmal getElement machen kann - bin nicht sicher ob das im ie oder firefox geht - im ie scheints ja zu gehen, aber oft sieht man solchen code nicht grade. das aber nur am rande, denn ich glaub das problem ist weiter unten:
sfEls[i].onmouseover=function() ... und
sfEls[i].onmouseout=function()...
soweit ich informiert bin, muss man heutzutage mit modernen browsern ein event wie "onmouseover" anders zuweisen - auf diese art geht es glaube ich nur mit sehr alten browsern wie netscape 4 usw - wie es aussieht interpretiert ie das aber auch.
ich glaube die meisten nutzen sowas in der art:
obj = document.getElementById("mein_element_mit_mouseover");
if (obj.addEventListener) {
//### Firefox, Opera, Safari
obj.addEventListener("mouseover", NAME_DER_FUNCTION, false);
} else if (all_links[i].attachEvent) {
//### IE
obj.attachEvent("onmouseover", NAME_DER_FUNCTION);
}
Hallo,
Das strotzt vor Fehlern - beseitigen, dann kann man weitersehen.
Deswegen kann man ja trotzdem versuchen, zu helfen.
deine Hilfsbereitschaft in allen Ehren - aber bevor du ordentliche JS-Lösungen kritisierst, solltest du vielleicht erstmal dein eigenes Wissen in diesem Bereich auf den neuesten Stand bringen.
document.getElementById("nav").getElementsByTagName("LI");
erstmal hab ich sowas noch nie gesehen, das von einem element, was man per "getElementByBlaBla" bekommt, gleich nochmal getElement machen kann
Das mag ungewöhnlich sein - aber es ist korrekt, effizient und sehr zielstrebig.
sfEls[i].onmouseover=function() ... und
sfEls[i].onmouseout=function()...
soweit ich informiert bin, muss man heutzutage mit modernen browsern ein event wie "onmouseover" anders zuweisen
Hä? Wie denn? Ein Javascript-Eventhandler erwartet ein Funktions-Objekt (wie hier gezeigt), alternativ eine Funktions-Referenz. Was du hier anprangerst, ist daher auch mustergültig - im Sinne der Trennung von Markup, Design und Funktion ist es sogar wesentlich besser, als die Eventhandler als Strings in HTML-Attributen zu notieren.
ich glaube die meisten nutzen sowas in der art:
obj = document.getElementById("mein_element_mit_mouseover");if (obj.addEventListener) {
//### Firefox, Opera, Safari
obj.addEventListener("mouseover", NAME_DER_FUNCTION, false);
} else if (all_links[i].attachEvent) {
//### IE
obj.attachEvent("onmouseover", NAME_DER_FUNCTION);
}
Das tut's vielleicht auch - aber warum derart kompliziert?
So long,
Martin
Hi,
Erstmal danke für die Antworten. Also wenn ich das richtig lese von Der Martin, dann ist der Code nicht gerade falsch in der .js-Datei. Jetzt stellt sich die Frage ob Sander recht hat, dass mein Code eher noch für ältere Browser ist oder nicht. Kann da jemand fachkundiges noch Stellung beziehen?
mfg
Grolli
Hi,
Jetzt stellt sich die Frage ob Sander recht hat, dass mein Code eher noch für ältere Browser ist oder nicht.
nein, dieses Script dürfte ok sein; die anderen am Ende des HTML-Codes dagegen sind eher peinlich. Das Problem dürfte im CSS liegen, mit dem Du ein DIV über den Navigationsbereich legst und diesen damit unsichtbar überdeckst.
Allerdings ist dieses Script für moderne Browser ohnehin nicht nötig, da diese Funktion auch rein über CSS realisierbar ist.
freundliche Grüße
Ingo
nein, dieses Script dürfte ok sein; die anderen am Ende des HTML-Codes dagegen sind eher peinlich. Das Problem dürfte im CSS liegen, mit dem Du ein DIV über den Navigationsbereich legst und diesen damit unsichtbar überdeckst.
Allerdings ist dieses Script für moderne Browser ohnehin nicht nötig, da diese Funktion auch rein über CSS realisierbar ist.
Also wenn ich dich richtig verstehe meinst du die ID wrap, dass ich die weglassen soll und die ID nav quasi nach dem Header als erstes nehmen soll?
mfg
Grolli
Hi,
Also wenn ich dich richtig verstehe meinst du die ID wrap, dass ich die weglassen soll
welches der (zu) vielen DIVS das ist, habe ich nicht nachgeprüft. Aber _das_ es eine Überlagerung gibt, zeigt mir die typografische Darstellung in der Webdeveloper Toolbar.
freundliche Grüße
Ingo
@@Sander:
Deswegen kann man ja trotzdem versuchen, zu helfen.
Genau das tat ChrisB.
JavaScript auf einen Elementbaum loszulassen, von dem man nicht wissen kann, wie er dank (besser gesagt: trotz) vermurkstem Quelltext aussieht, kann keine gute Idee sein.
Zuerst das HTML zu berichtigen ist wohl der beste Hinweis, den man geben kann.
Live long and prosper,
Gunnar