Zum Inhalt springen

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

burnersk

Von burnersk
in Webdesign

 Teilen

Empfohlene Beiträge

burnersk

burnersk

Geschrieben
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?

Link zu diesem Kommentar
Auf anderen Seiten teilen
forTeesSake

forTeesSake

Geschrieben
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]

Link zu diesem Kommentar
Auf anderen Seiten teilen
forTeesSake

forTeesSake

Geschrieben
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 ;)

Link zu diesem Kommentar
Auf anderen Seiten teilen
burnersk

burnersk

Geschrieben
  • Autor
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?

Link zu diesem Kommentar
Auf anderen Seiten teilen
forTeesSake

forTeesSake

Geschrieben
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?

Link zu diesem Kommentar
Auf anderen Seiten teilen
forTeesSake

forTeesSake

Geschrieben
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?

Link zu diesem Kommentar
Auf anderen Seiten teilen
forTeesSake

forTeesSake

Geschrieben
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

Link zu diesem Kommentar
Auf anderen Seiten teilen
burnersk

burnersk

Geschrieben
  • Autor
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;

Link zu diesem Kommentar
Auf anderen Seiten teilen
burnersk

burnersk

Geschrieben
  • Autor
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)

Link zu diesem Kommentar
Auf anderen Seiten teilen
burnersk

burnersk

Geschrieben
  • Autor
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

Link zu diesem Kommentar
Auf anderen Seiten teilen
forTeesSake

forTeesSake

Geschrieben
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... ;(

Link zu diesem Kommentar
Auf anderen Seiten teilen

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.

×
 Teilen
Zur Themenübersicht

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.

Links

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...