Zum Inhalt springen

[JavaScript][Firefox] Keine Styleveränderung nach ID


Empfohlene Beiträge

Geschrieben

Hallo.

Habe eine Problem mit JavaScript und Firefox (beim MSchrott funktionierts, Opera auch).

JavaScript teil:

function Div_Show () {

  divid1.style.visibility = 'visible';

};

function Div_Hide () {

  divid1.style.visibility = 'hidden';

};

HTML teil:
<div id="divid1" style="visibility: visible;">in der "richtigen" Datei steht natürlich mehr im Style und Div </div>[/code]

Kennt jemand eine Lösung für "alle" Browser?

Geschrieben

so in etwa:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">


<html>

<head>

	<title>Untitled</title>

<script>

function showHideDiv(id){

	if(eval("document.getElementById('" + id + "').style.display == 'block'")){

		eval("document.getElementById('" + id + "').style.display = 'none'")

	}else{

		eval("document.getElementById('" + id + "').style.display = 'block'")	

	}

}

</script>

</head>


<body>

<div id="divid1" style="display: none;">in der "richtigen" Datei steht natürlich mehr im Style und Div </div>

<button onClick="showHideDiv('divid1');">Klick mich!</button>


</body>

</html>


[/code]

Geschrieben

Hi.

Jo, vielen Dank. War aber früher einfacher, oder? Mein erster Post hatte früher bei Firefox funktioniert (v1.1.x). Gibt es eine neue JavaScript Richtlinie, die ich verpasst habe???

Geschrieben
Hi.

Jo, vielen Dank. War aber früher einfacher, oder? Mein erster Post hatte früher bei Firefox funktioniert (v1.1.x). Gibt es eine neue JavaScript Richtlinie, die ich verpasst habe???

hmm schwierig. man sollte eigentlich auf elemente immer per getElementById bzw. per tagName[] zugreifen. das ist sicherer und browserübergreifend.

ausserdem ist meine gepostete funktion universell anwendbar. deine wäre ja statisch und somit nur für das eine div mit dem namen "divid1" einsetzbar.

ist zwar ein kleines bisschen mehr code, erleichtert dir aber einiges und vor allem funktioniert in mehreren browsern ;)

Geschrieben

Hallo.

Nur noch ein kleines Problem:

Fehler: Fehler beim Verarbeiten des Wertes für Eigenschaft 'overflow'. Deklaration ignoriert.

Quelldatei: http://localhost/design.htm

Zeile: 0

<div id="banner" style="position:absolute; width:468px; height:60px; z-index:2; left: 300px; top: 10px; overflow: hidden; visibility: visible; background-color: #DFAB1F; layer-background-color: #DFAB1F;"></div>

Gibt es eine Alternative hierfür?

Geschrieben
Hallo.

Nur noch ein kleines Problem:

<div id="banner" style="position:absolute; width:468px; height:60px; z-index:2; left: 300px; top: 10px; overflow: hidden; visibility: visible; background-color: #DFAB1F; layer-background-color: #DFAB1F;"></div>

Gibt es eine Alternative hierfür?

öööh..das ist jetzt aber ein anderes thema wenn ich das richtig sehe oder?

worum gehts?

was soll das werden? ein banner? wie und wo und warum und überhaupt ;)

wer oder was spuckt den fehler aus?

Geschrieben

Na ja. Je nach dem Blickwinkel ;)

Java Konsole gibt den Fehler aus. Deswegen kann ich auf die Einstellung im Style Tag auch nicht zugreifen. Im Grunde das gleiche wie oben nur anstatt mit "visabbility" mit "overflow".

Geschrieben

ich kann das jetzt grad nicht testen, aber sollte es nicht so funktioniieren:


<script>

function showHideDiv(id){

	if(eval("document.getElementById('" + id + "').style.overflow== 'hidden'")){

		eval("document.getElementById('" + id + "').style.overflow = 'visible'")

	}else{

		eval("document.getElementById('" + id + "').style.overflow = 'hidden'")	

	}

}

</script>

oder?

Geschrieben

Hi.

Vielen Dank erstmal, aber das hatte ich bereits versucht. Hier das Problem:

Als HTML wertet Firefox den Schlüssel richtig aus (kein Fehler in Java Konsole). Greife ich aber per Java drauf zu kommt ein Fehler (s.o.)...

Geschrieben


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">


<html>

<head>

	<title>Untitled</title>

<script>

function showHideDiv(id){

	if(eval("document.getElementById('" + id + "').style.overflow== 'hidden'")){

		eval("document.getElementById('" + id + "').style.overflow = 'visible'")

	}else{

		eval("document.getElementById('" + id + "').style.overflow = 'hidden'")	

	}

}

</script>

</head>


<body>

<div id="divid1" style="width: 100px;white-space: nowrap;overflow; hidden;">in der "richtigen" Datei steht natürlich mehr im Style und Div </div>

<button onClick="showHideDiv('divid1');">Klick mich!</button>


</body>

</html>



[/code]

so auch? in meinem FF läuft das ohne Fehler

Allerdings würde ich dann die javascript funktion noch anpassen und die attribute und ihre beiden zustände variabel anlegen, also übergabe dann z.b.

(

id,

styleAttribute,

styleActiveVal,

styleInActiveValue

)

oder so in der Art

Geschrieben

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">


<html>

<head>

	<title>Untitled</title>

<script>

function showHideDiv(id){

	if(eval("document.getElementById('" + id + "').style.overflow== 'hidden'")){

		eval("document.getElementById('" + id + "').style.overflow = 'visible'")

	}else{

		eval("document.getElementById('" + id + "').style.overflow = 'hidden'")	

	}

}

</script>

</head>


<body>

<div id="divid1" style="width: 100px;white-space: nowrap;overflow; hidden;">in der "richtigen" Datei steht natürlich mehr im Style und Div </div>

<button onClick="showHideDiv('divid1');">Klick mich!</button>


</body>

</html>



[/code]




so auch? in meinem FF läuft das ohne Fehler



Allerdings würde ich dann die javascript funktion noch anpassen und die attribute und ihre beiden zustände variabel anlegen, also übergabe dann z.b. 



(

id,

styleAttribute,

styleActiveVal,

styleInActiveValue

)



oder so in der Art



So klapt es prima. Aber was ist das den für ein Bug? Normalerweise heiß es doch so: 
[code]overflow[COLOR="Red"];[/COLOR] hidden;
anstatt
overflow[COLOR="Red"]:[/COLOR] hidden;

Geschrieben
nein, es heisst immer

overflow: hidden;

zuerst das styleAttribut, dann ein Doppelpunkt, dann ein Leerzeichen, dann den/die Wert/e dann abschließend ein Semikolon!

Ja weiß ich. Du hast es aber mit ; ; gepostet und damit hat es funktioniert. Nicht mit : ; (Copy & Paste)

Geschrieben
Ja weiß ich. Du hast es aber mit ; ; gepostet und damit hat es funktioniert. Nicht mit : ; (Copy & Paste)

ouch! das ist natürlich falsch, aber auch wenn ich es richtig schreibe, geht das sowohl IE 6 als auch FF.

probiers bitte nochmal...

Geschrieben
ouch! das ist natürlich falsch, aber auch wenn ich es richtig schreibe, geht das sowohl IE 6 als auch FF.

probiers bitte nochmal...

Bei mir binkt dann die Java Konsole (Fehler) auf. Kann es da komplikationen mit Extensions geben?

  • Fasterfox 1.0.3
  • MinimizeToTray 0.0.1
  • Google ToolBar für Firefox 2.0.2

Geschrieben
Bei mir binkt dann die Java Konsole (Fehler) auf. Kann es da komplikationen mit Extensions geben?

  • Fasterfox 1.0.3
  • MinimizeToTray 0.0.1
  • Google ToolBar für Firefox 2.0.2

puhh sorry, das weiss ich nicht.

das ist nochmal der gesamte code, nur mit deinen angaben:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">


<html>

<head>

	<title>Untitled</title>

<script>

function showHideDiv(id){

	if(eval("document.getElementById('" + id + "').style.overflow== 'hidden'")){

		eval("document.getElementById('" + id + "').style.overflow = 'visible'")

	}else{

		eval("document.getElementById('" + id + "').style.overflow = 'hidden'")	

	}

}

</script>

</head>


<body>

<div id="divid1" style="width: 100px;white-space: nowrap;position:absolute; height:60px; z-index:2; left: 300px; top: 10px; overflow: hidden; visibility: visible; background-color: #DFAB1F; layer-background-color: #DFAB1F;">

in der "richtigen" Datei steht natürlich mehr im Style und Div 

</div>

<button onClick="showHideDiv('divid1');">Klick mich!</button>


</body>

</html>


[/code]

ich hab keine extensions installiert und die FF version 1.0.7 am laufen.

alles funzt... ;(

Dein Kommentar

Du kannst jetzt schreiben und Dich später registrieren. Wenn Du ein Konto hast, melde Dich jetzt an, um unter Deinem Benutzernamen zu schreiben.

Gast
Auf dieses Thema antworten...

×   Du hast formatierten Text eingefügt.   Formatierung wiederherstellen

  Nur 75 Emojis sind erlaubt.

×   Dein Link wurde automatisch eingebettet.   Einbetten rückgängig machen und als Link darstellen

×   Dein vorheriger Inhalt wurde wiederhergestellt.   Editor leeren

×   Du kannst Bilder nicht direkt einfügen. Lade Bilder hoch oder lade sie von einer URL.

Fachinformatiker.de, 2024 by SE Internet Services

fidelogo_small.png

Schicke uns eine Nachricht!

Fachinformatiker.de ist die größte IT-Community
rund um Ausbildung, Job, Weiterbildung für IT-Fachkräfte.

Fachinformatiker.de App

Download on the App Store
Get it on Google Play

Kontakt

Hier werben?
Oder sende eine E-Mail an

Social media u. feeds

Jobboard für Fachinformatiker und IT-Fachkräfte

×
×
  • Neu erstellen...