nicht angemeldet
DHTML auf NN 6
Hi Leute!
Ich bin am Verzweifeln. Ich habe versucht, ein aufklappbares DHTML-Menü zusammen zu kriegen, aber auf dem Netscape läuft es nicht vollständig. Die Effekte sollen durch Veränderung des Stylesheet bewirkt werden. Eine Farbveränderung beim Mouseoverevent habe ich auch im Netscape hinbekommen, aber mit dem Auf- und Zuklappen wird es einfach nichts. Ich habe eine (funktionierende) Version für IE 6 auf www.8ung.at/michaelkupsch geladen und auch die nicht funktionierende für den Netscape. Es wäre ganz toll, wenn ihr mir schreiben könntet, was ich falsch mache, oder ihr eine veränderte Version an MichaelKupsch@web.de sendet.
-
Hi
Ich bin am Verzweifeln. Ich habe versucht, ein aufklappbares DHTML-Menü zusammen zu kriegen, aber auf dem Netscape läuft es nicht vollständig. Die Effekte sollen durch Veränderung des Stylesheet bewirkt werden. Eine Farbveränderung beim Mouseoverevent habe ich auch im Netscape hinbekommen, aber mit dem Auf- und Zuklappen wird es einfach nichts. Ich habe eine (funktionierende) Version für IE 6 auf www.8ung.at/michaelkupsch geladen und auch die nicht funktionierende für den Netscape. Es wäre ganz toll, wenn ihr mir schreiben könntet, was ich falsch mache, oder ihr eine veränderte Version an MichaelKupsch@web.de sendet.
Nö, hier "denkt" es sich doch viel angenehmer ;-)
Hier dein NN6-Code:
//Doctype fehlt schonmal.
<html>
<head>
<style type="text/css">
<!--
a {font-family: arial; font-weight: bold; text-decoration: none; color: #000000}
.hell {background-color: #dddddd}
.dunkel {background-color: #999999}
.aus {visibility: hidden}
.an {background-color: #999999; visibility: display}//Was bitte ist visibility:display;? Gibt's nicht, schon ist das System im Eimer...
//-->
</style>
</head>
<body bgcolor="#dddddd">
<script LANGUAGE="javascript"> //Da darfst du selber suchen, wann hat es endlich der letzte kapiert, wie man _JS richtig einbindet_[tm]?
<!--
function over(menu) {
menu.className="dunkel";//Was ist "menu"? Besser erstmal ein eval();
[...]
//-->
</SCRIPT>
<LAYER id="NHome" class="hell" position="absolute" top="0px" left="0px" onmouseover="javascript:over(this)" onmouseout="javascript:out(this)">
<div id="Home" class="hell" style="position:absolute;top:0px;left:0px" onmouseover="javascript:over(this)" onmouseout="javascript:out(this)">
<table border="0" width="100"><tr><td><a href="home.shtml"> Home</a></td></tr></table>
</div>
</LAYER>// *ARRGH* Layer kann der Netscape 6 doch nicht!
Wenn du DHTML im "neuen" Netscape machen willst, dann kommst du um DOM nicht rum, und erschlägst auch gleichzeitig den IE. Opera 7 zieht ja jetzt auch mit, also: Warum der Aufwand?
Fabian
-
genauer als meine Ausführungen ;-)
Aber wohl wahr, wohl wahr!
Robin
-
function over(menu) {
menu.className="dunkel";//Was ist "menu"? Besser erstmal ein eval();
Bitte?
eval ist in 99% der Fälle überflüssig. Daneben fehlerträchtig, fehlerverursacehnd und du findest Fehler nicht mehr, weil die Fehlermeldungen nicht mehr deutlich sind.
Du meinst evtl. sowas: if(!menu) alert('menu ist nicht definiert';
Aber dafür brauch man kein eval.
Struppi.
-
Hi
Bitte?
eval ist in 99% der Fälle überflüssig. Daneben fehlerträchtig, fehlerverursacehnd und du findest Fehler nicht mehr, weil die Fehlermeldungen nicht mehr deutlich sind.
Wenn du sauber programmierst ist ein eval() Gold wert.
Wenn du nämlich zum Beispiel
document.getElementById(variable).style in nem eval() unterbringst hast du bei großen Scripten erstens weniger Schreibarbeit und zweitens geringe Performancegewinne.Und wo sollen denn Fehlermeldungen herkommen? Lässt du nicht debuggte Scripte etwa auf Surfer los?
Du meinst evtl. sowas: if(!menu) alert('menu ist nicht definiert';
Nein, das geht in diesem Fall nicht, da menu in jedem Fall zwar definiert ist, aber kaum tun wird, was es soll, da der this-zeiger in externen Funktionen in JS nicht funktioniert. Und bitte setze die )-Klammer noch, das ist nicht unwichtig >;)
Aber dafür brauch man kein eval.
IMHO schon.
Fabian
-
Hi
Bitte?
eval ist in 99% der Fälle überflüssig. Daneben fehlerträchtig, fehlerverursacehnd und du findest Fehler nicht mehr, weil die Fehlermeldungen nicht mehr deutlich sind.
Wenn du sauber programmierst ist ein eval() Gold wert.
Wenn du nämlich zum Beispiel
document.getElementById(variable).style in nem eval() unterbringst hast du bei großen Scripten erstens weniger Schreibarbeit und zweitens geringe Performancegewinne.Wieso sollte eval einen Performancegewinn bringen? Dadurch wird der Code einfach nur während der Laufzeit übersetzt, anstatt zu beginn, was mit Sicherheit performanter ist und weniger Schreibarbeit ist es mit sicherheit auch. Dazu kommt es ist übersichtlicher und wenn du einen vernünftigen Browser benutzt siehst du die Fehler beim entwickeln wesentlich leichter.
eval ist unnötig!
Und wo sollen denn Fehlermeldungen herkommen? Lässt du nicht debuggte Scripte etwa auf Surfer los?
Nein, aber du baust eval nach dem debuggen ein?
Du meinst evtl. sowas: if(!menu) alert('menu ist nicht definiert';
Nein, das geht in diesem Fall nicht, da menu in jedem Fall zwar definiert ist, aber kaum tun wird, was es soll, da der this-zeiger in externen Funktionen in JS nicht funktioniert. Und bitte setze die )-Klammer noch, das ist nicht unwichtig >;)menu ist zwar definiert, aber leer, d.h. if(!menu) ist wahr wenn es null oder ein Leerstring ist.
Und was heißt this in externen Funktionen?
this bezieht sich immer auf das aktuelle Objekt, je nach Kontext.Und deshalb funktioniert das was der OP wollte, allerdings kann NC 4.x kein className ändern, abner ansonsten geht alles andere
Probier's aus:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<script>
function test(obj)
{
obj.x += 10;
}
</script>
</head><body>
<layer style="position:absolute;" onmouseover="test(this);">test</layer>
</body>
</html>Aber dafür brauch man kein eval.
IMHO schon.Wieso?
Struppi.
-
Hi
eval ist in 99% der Fälle überflüssig. Daneben fehlerträchtig, fehlerverursacehnd und du findest Fehler nicht mehr, weil die Fehlermeldungen nicht mehr deutlich sind.
Wenn du sauber programmierst ist ein eval() Gold wert.
Wenn du nämlich zum Beispiel
document.getElementById(variable).style in nem eval() unterbringst hast du bei großen Scripten erstens weniger Schreibarbeit und zweitens geringe Performancegewinne.Wieso sollte eval einen Performancegewinn bringen? Dadurch wird der Code einfach nur während der Laufzeit übersetzt, anstatt zu beginn, was mit Sicherheit performanter ist und weniger Schreibarbeit ist es mit sicherheit auch. Dazu kommt es ist übersichtlicher und wenn du einen vernünftigen Browser benutzt siehst du die Fehler beim entwickeln wesentlich leichter.
Ich verwende einen ordentlichen Browser, und ich habe in der Tat keine Probleme mit eval, im Gegenteil, es hilft manchmal doch bei verallgemeinerten Funktionen.
Mir ist sicher klar, was eval tut, deswegen mag ich es ja, anstatt 300mal document.getElementById("x").style zu nehmen, das ganze per eval() auf auf "x" zu reduzieren. Wir reden von verschiedenen Anwendungen.
Aber unsere Meinungen gehen dabei auseinander, wir sollten es dabei belassen ;-)Und wo sollen denn Fehlermeldungen herkommen? Lässt du nicht debuggte Scripte etwa auf Surfer los?
Nein, aber du baust eval nach dem debuggen ein?Natürlich nicht, sondern vorher. Hinterher baue ich garnix mehr ein.
Fabian
-
Hi
eval ist in 99% der Fälle überflüssig. Daneben fehlerträchtig, fehlerverursacehnd und du findest Fehler nicht mehr, weil die Fehlermeldungen nicht mehr deutlich sind.
Wenn du sauber programmierst ist ein eval() Gold wert.
Wenn du nämlich zum Beispiel
document.getElementById(variable).style in nem eval() unterbringst hast du bei großen Scripten erstens weniger Schreibarbeit und zweitens geringe Performancegewinne.Wieso sollte eval einen Performancegewinn bringen? Dadurch wird der Code einfach nur während der Laufzeit übersetzt, anstatt zu beginn, was mit Sicherheit performanter ist und weniger Schreibarbeit ist es mit sicherheit auch. Dazu kommt es ist übersichtlicher und wenn du einen vernünftigen Browser benutzt siehst du die Fehler beim entwickeln wesentlich leichter.
Ich verwende einen ordentlichen Browser, und ich habe in der Tat keine Probleme mit eval, im Gegenteil, es hilft manchmal doch bei verallgemeinerten Funktionen.was sind "verallgemeinerten Funktionen"?
Das hört sich an als ob du irgendeinen Code nimmst und dann sagst da hau ich mal eval drüber, wird schon klappen. Grad bei so Sachen wie DHTML/Layer ist es wichtig allgemeingültige Funktionen zu bauen, die auch Fehler alleine abfangen anstatt zu hoffen, das es eval irgendwie tun wird.Mir ist sicher klar, was eval tut, deswegen mag ich es ja, anstatt 300mal document.getElementById("x").style zu nehmen, das ganze per eval() auf auf "x" zu reduzieren. Wir reden von verschiedenen Anwendungen.
Aber unsere Meinungen gehen dabei auseinander, wir sollten es dabei belassen ;-)Ja gut, aber wenn du erzählst das eval gut ist, ohne das zu belegen, könnten das Anfänger zum Anlass nehmen es unnötigerweise zu benutzen.
Und wenn ich deine obige Aussgae richitg verstehe ist bei dir:
document.getElementById("x").style
das Gleiche wie eval('x') oder was meinst du?üblicherweise benutzt man für sowas Bibliotheken, da ja noch lange nicht alle Browser getElement.. verstehen insofern benutz ich einfach die Funktion der Bibliothek in der Form (z.b):
var obj = getLayerById(id);
if(obj) tu was mit dem layerund da will mir bei besten Willen kein eval einleuchten.
Struppi.
-
Hi
was sind "verallgemeinerten Funktionen"?
Das hört sich an als ob du irgendeinen Code nimmst und dann sagst da hau ich mal eval drüber, wird schon klappen. Grad bei so Sachen wie DHTML/Layer ist es wichtig allgemeingültige Funktionen zu bauen, die auch Fehler alleine abfangen anstatt zu hoffen, das es eval irgendwie tun wird.Beispiel:
var sol = eval("document.getElementById("sol").style");
sol.top = "12px";
etc. pp.Leutet das nicht ein?
Fabian
-
Hi
was sind "verallgemeinerten Funktionen"?
Das hört sich an als ob du irgendeinen Code nimmst und dann sagst da hau ich mal eval drüber, wird schon klappen. Grad bei so Sachen wie DHTML/Layer ist es wichtig allgemeingültige Funktionen zu bauen, die auch Fehler alleine abfangen anstatt zu hoffen, das es eval irgendwie tun wird.Beispiel:
var sol = eval("document.getElementById("sol").style");
sol.top = "12px";
etc. pp.Leutet das nicht ein?
Nö, das ist also einfacher und kürzer als das:
var sol = document.getElementById("sol").style;
sol.top = "12px";Struppi.
-
Und zum Schluss nochmal was wegen dem Geschwindigkeitsvorteil, von dem du sprachst:
function test()
{
var l= 1000;var t1 = eval_test(l);
var t2 = no_eval_test(l);alert('mit eval:' + t1 + '\nohne eval:' + t2);
}
function eval_test(l)
{
var t1 = new Date();
for(var i = 0; i < l;i++)
{
var obj = eval('t'+ '.style');
obj.backgroundColor = (i % 2) ? '#000' : '#fff';
}var t2 = new Date();
return t2.getTime() - t1.getTime();
}
function no_eval_test(l)
{
var t1 = new Date();
for(var i = 0; i < l;i++)
{
var obj = document.all['t'].style;
obj.backgroundColor = (i % 2) ? '#000' : '#fff';
}
var t2 = new Date();
return t2.getTime() - t1.getTime();
}Die eval Variante ist 50% bis 100% langsamer, als ohne.
Struppi.
-
-
-
-
-
-
-
-
-
Hallo Michael,
ich habe erst vor vorgestern festgestellt, dass es besser ist, den DIVs im NS6 Klassen zuzuweisen anstatt Ids. Warum auch immer. Siehe Thread "margin und position absolute" ziemlich weit unten hier im Forum (11.12. gegen 17.45 Uhr gestartet). Das hat zwar mit Deinem Problem direkt nicht viel zu tun, weiul es da um exakte Positionierung ging, auf jeden Fall handlet NS6 Klassen-DIVs wohl besser als ID-Divs.
Auf das <layer>-Tag solltest Du am besten komplett verzichten.
Ich habe noch nie ein Aufklappmenü gebraucht, der Auftrag steht gerade erst an ;-) Aber unter www.musikfestival-irsee.de/deutsch/html/fotogalerie_IE-NS6.html findest Du mein Script, um Textinhalte dynamisch zu ändern. Vielleicht kannst Du da ein paar nützliche Sachen draus ziehen und Dein Script dementsprechend umbauen.
Grüsse, Robin
-
Hi Michael-2712!
Ich bin am Verzweifeln. Ich habe versucht, ein aufklappbares DHTML-Menü zusammen zu kriegen, aber auf dem Netscape läuft es nicht vollständig.
NullProblemo: ich mache alles mit <div>s und JavaScripten, funktioniert prima, ist aber ziemlich diffizil. Hat den Vorteil, dass ich statt der unendlich vielen htm-Austauschseiten nur eine bis drei Seiten brauche (1× *.htm, 1× *.js und 1× *.css).
Hier ein kleiner Vorgeschmack:
-------------Schalter für sichtbar/unsichtbar------
<html><head><title>visibility/hidden</title>
<script language="JavaScript" type="text/javascript">
<!--
function zeige() {
if(document.getElementById)
document.getElementById("ueberschrift").style.visibility = "visible";
}
function verstecke() {
if(document.getElementById)
document.getElementById("ueberschrift").style.visibility = "hidden";
}
//-->
</script>
</head><body bgcolor="FFFFFF" text="#000000"><h1 id="ueberschrift" style="visibility:hidden">Die Überschrift zum Text</h1>
<p>Hier der Text. Aber fehlt da nicht was?</p>
<p><a href="javascript:zeige()">Anzeigen!</a></p>
<p><a href="javascript:verstecke()">Verstecken!</a></p>
</body>
</html>
------------- LayerTechnologie ----
------------ z-Index:1; = unten ---
------------ z-Index:6; = oben ----
------------ z-Index:-1; = versteckt (interpretiert IE5.5 nicht!) ---
<HEAD>
<TITLE> LAYER-StilTechnik </TITLE>
<style type="text/css">
<!--
#bild001 { position:absolute; left:300pt; top:100pt; z-Index:1; }
#bild002 { position:absolute; left:170pt; top:150pt; z-Index:2; }
#bild003 { position:absolute; left:240pt; top:220pt; z-Index:3; }
#bild004 { position:absolute; left:240pt; top:220pt; z-Index:4; }
#textfeld001 { position:absolute; left:60pt; top:70pt; z-Index:5; }
#textfeld002 { position:absolute; left:200pt; top:140pt; z-Index:6; }
//-->
</style></HEAD>
<BODY>
<div id="bild001"><img src="BILDER/frN01.gif" width="70" height="58" border="0" alt="xxx"></div>
<div id="bild002"><img src="BILDER/frNietzsche1t2.jpg" width="70" height="58" border="0" alt="xxx"></div>
<div id="bild003"><img src="BILDER/frNietzsche1.jpg" width="70" height="58" border="0" alt="xxx"></div>
<div id="bild004"><img src="BILDER/frNietzsche1t1.gif" width="70" height="58" border="0" alt="xxx"></div><div id="textfeld001">
<table width=100px height=160px>
<td> 1111</td>
<td> 2222</td>
</table>
</div><div id="textfeld002">
<table width=140px height=80px>
<td> xxxx</td>
<td> yyyy</td>
</table>
</div>
</body>
-------------
Viel Spass wünscht dir Klaus-
Hi Michael-2712!
Ich bin am Verzweifeln. Ich habe versucht, ein aufklappbares DHTML-Menü zusammen zu kriegen, aber auf dem Netscape läuft es nicht vollständig.
NullProblemo: ich mache alles mit <div>s und JavaScripten, funktioniert prima, ist aber ziemlich diffizil. Hat den Vorteil, dass ich statt der unendlich vielen htm-Austauschseiten nur eine bis drei Seiten brauche (1× *.htm, 1× *.js und 1× *.css).
Hier ein zweiter Vorgeschmack:
-------------Schalter für sichtbar/unsichtbar und Wechsel------
<html>
<head>
<title>:: visibility ::</title>
<script language="JavaScript" type="text/javascript">
<!--
function zeige() {
if(document.getElementById)
document.getElementById("ueberschrift").style.visibility = "visible";
}
function verstecke() {
if(document.getElementById)
document.getElementById("ueberschrift").style.visibility = "hidden";
}
function schalter() {
if(document.getElementById("ueberschrift").style.visibility == "hidden")
document.getElementById("ueberschrift").style.visibility = "visible";
else
document.getElementById("ueberschrift").style.visibility = "hidden";
}
//-->
</script>
</head><body bgcolor="FFFFFF" text="#000000"><h1 id="ueberschrift" style="visibility:hidden">Die Überschrift zum Text</h1>
<p>Hier der Text. Aber fehlt da nicht was?</p>
<p><a href="javascript:zeige()">Anzeigen!</a></p>
<p><a href="javascript:verstecke()">Verstecken!</a></p>
<p><a href="javascript:schalter()">Anzeigen-Verstecken</a></p></body>
</html>
Viel Spass wünscht dir Klaus
-