[HTML/JS] Funktion funktioniert im IE6 aber nicht in Mozilla

michaelp · 2. April 2005

Ich arbeite gerade an dieser Seite: http://www.bonamente.de.vu

Im IE6 funktioniert die Menüleiste einwandfrei. die untermenüs öffnen sich auch.
Aber im Mozilla gibt es auf den Buttons mit Untermenüs keine Rollovereffekte und auch die Menüs erscheinen nicht.

Hier der Code für den Funktionsaufruf:

Code:

<img id="home" src="images/home1.gif" height="33" width="100" alt="Home" onmouseover="over(id)" onmouseout="out(id)">

ein normaler Button ohne Menü

Code:

<img id="produkte" src="images/produkte1.gif" height="33" width="100" alt="Produkte" onmouseover="over(id), overmenu('menua')" onmouseout="out(id)">

ein Button mit Menü

Die Funktionen:

Code:

function over(id) {
	if (id) {
		var image = id + "2" + ".gif";
		document.images[id].src = "images/" + image;
		}
	}
	
function out(id) {
	if (id) {
		var image = id + "1" + ".gif";
		document.images[id].src = "images/" + image;
		}
	}

function overmenu(ele) {
	document.getElementById(ele).style.visibility = "visible";
	}

Wieso funktioniert das im Mozilla nicht.

Faustpfand · 2. April 2005

document.images[id].src gibt es -- soweit ich weiß -- im Mozilla nicht. Da musst du wohl -- ähnlich wie bei der unteren Funktion -- document.getElementById(id).src verwenden.

Außerdem musst du beim Aufruf der Funktion auch die ID des Elements angeben, und nicht einfach id stehen lassen.

michaelp · 2. April 2005

die id wird ja an die funktion übergeben

document.images[id].src funktioniert bei dem ersten button ja auch

michaelp · 2. April 2005

das problem muss im funktionsaufruf liegen, denn mit dem js-debugger im mozilla wird nur bei den schaltflächen ohne menü die funktion aufgerufen.

Arnd · 2. April 2005

Hallo,

nur als Kommentar. Wenn ich einmal mit der Maus über alle Menüs fahre, habe ich für eine gewisse Zeit alle Menüs offen. Das sieht etwas gewöhnungsbedürftig aus.
Zwar verschwinden schon alle Menüs, aber der Timeout ist für meinen Geschmack etwas hoch angesetzt.

MfG

Arnd

michaelp · 3. April 2005

so jetzt funktioniert das zumindest auch im mozilla. allerdings blendet es dort die menüs wieder aus, wenn man zu lange über der schrift in dem menü ist

Benjamin_L · 4. April 2005

wie schon erwähnt ist document.all veraltet und sollte nicht mehr verwendet werden!

michaelp · 4. April 2005

ich ruf jetzt aber alles nur mit document images auf

[UPS]Erazor · 4. April 2005

michaelp schrieb:
ich ruf jetzt aber alles nur mit document images auf

Dann wirst du wohl alles ändern müssen, damits im Mozilla läuft.

Benjamin_L · 4. April 2005

wenn du nicht standardkonform codest, dann funktionierts hald nicht in allen Browsern, so einfach. was ist denn so schwer, das ordentlich mit document.getElementById(id).src zu machen ?

Außerdem fehlt der Seite ein Doctype:
http://www.w3.org/QA/2002/04/valid-dtd-list.html

zweimal <head>, <html> und <body> macht auch nicht viel Sinn!

und das gewählte tab würde ich hervorheben, nicht absenken, aber das ist jetzt erstmal nicht so wichtig ^^

michaelp · 4. April 2005

ich mach jetzt alles mit document.getElementById(id).src

doctype?

Wo hab ich denn zweimal <head> <html> und <body>?

Benjamin_L · 4. April 2005

Der Doctype ist wichtig, damit die Browser in den Standardkompatibilätsmodus wechseln und die Seite richtig interpretieren!

Im Gästebuch z.B.

[edit]
du musst nur noch ne funktion auf die knöpfe machen, dass das mouseout da auch funktioniert. Wenn du im menü bist und aus dem div dann rausgehst, dann gehts ja.

michaelp · 4. April 2005

und was für nen doctype muss ich nehmen? hab davon noch nix gehört.

oDeM · 4. April 2005

Der Functionsaufruf ist meines Erachtens falsch.
Wenn muss der Parameter schon this.id heissen. Ich weiss nicht ob alle Browser einfach nur id schlucken. Der IE frißt ja alles was man ihm sagt, dass Sch***teil

Ansonsten würde ich auch nicht den weg über images[id] gehen, sondern die DOM.Kompatible schreibweise getElementById(id), aber das wurde ja auch schon gesagt.
Mit dem Doctype hat das ganze doch gar nix zu tun.

Was gibt denn ein alert(id); beim Aufruf der Funktionen in den verschiedenen Browsern aus?

michaelp · 4. April 2005

Bevor jetzt Verwirrung entsteht, hier nochmal der neue Code:

Code:

function over(id) {
	var image = id + "2" + ".gif";
	document.getElementById(id).src = "images/" + image;
	}
	
function out(id) {
	var image = id + "1" + ".gif";
	document.getElementById(id).src = "images/" + image;
	}

function overmenu(ele) {
	document.getElementById(ele).style.visibility = "visible";
	}

function outmenu(ele) {
	setTimeout(los, 500);
	function los() {
		document.getElementById(ele).style.visibility = "hidden";
		}
	}

Im Mozilla klappts ja nun auch mit "id". Mein Problem ist jetzt nur, dass im Mozilla die Menüs ausgeblendet werden, wenn man für die 500ms auf der Schrift im Menü war.

Benjamin_L · 4. April 2005

@oDeM: dass der Doctype bei dem Problem nicht hilft ist mir klar, er gehört aber dennoch zur konformen Seite dazu.

4.0.1 Transitional sollte erstmal reichen. Daanch kannst du deinen HTML Code hier testen:
http://validator.w3.org/

Wenn du die gleiche Funktion wie beim Ausblenden der Menüs auf den jeweiligen Knopf legst, sollte es gehen!

Arnd · 4. April 2005

Hallo Michael,

also der aktuelle Stand funktioniert schlechter als vorher. Jetzt ist es kein Problem das Menüs offen stehen bleiben. Sorry wenn ich zum Thema HTML/Javascript Programmierung nicht soviel beitragen kann.

MfG

Arnd

Suche

michaelp

Ensign

Faustpfand

Gast

michaelp

Ensign

michaelp

Ensign

Arnd

Lieutenant

michaelp

Ensign

Benjamin_L

Commander

michaelp

Ensign

[UPS]Erazor

Lieutenant

Benjamin_L

Commander

michaelp

Ensign

Benjamin_L

Commander

michaelp

Ensign

oDeM

Lt. Junior Grade

michaelp

Ensign

Benjamin_L

Commander

Arnd

Lieutenant

Ähnliche Themen