Supportnet Computer
Planet of Tech

Supportnet / Forum / Webseiten/HTML

Menu mit externem Javascript





Frage

Ich habe eine html-datei mit eingebettetem JS für das Navi-Menu. Das sieht so aus (Kurzbeispiel) <html> <head> <title>Untitled Document</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <script language="JavaScript" type="text/javascript"> menu="<a href=´link1.html´ target=´blank´>Link 1</a><br><br><a href=´link2.html´ target=´blank´>Link 2</a>"; </script> </head> <body bgcolor="#FFFFFF" text="#000000"> <script language="JavaScript">document.write(menu);</script> </body> </html> Nun habe ich versucht, das JS in eine externe Datei zu schreiben, aber dann klappt nix mehr - ich komme leider nicht dahinter, wie die Schreibweise in einem externen JS sein muß. Hier stoße ich an die Grenzen meines Autodidaktentums. Kann bitte jemand helfen? Ich brauch keine drop-down- oder sonstigen Spielereien, ich will das Menu nur eine eine externe JS-Datei auslagern.

Antwort 1 von DeluxeStyle

wäre natürlich gut zu wissen, wie du versuchst, die externe JavaScript Datei einzubinden?

hast du z.B. ne Menue.js Datei (also hauptsächlich ne .js Datei)?
bindest du die dann auch richtig ein?

schreib mal, wie du das machen würdest

Antwort 2 von rfb

in 2 dateien sieht es so aus:
<html lang="de"> 
<head> 
<title>Untitled Document</title> 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> 
<script type="text/javascript" src="menue.js"></script> 
</head> 
<body style="background:#fff";color:#000"> 
<script type="text/javascript">document.write(menu);</script> 
</body> 
</html>


in der Datei menue.js (einfache ASCII_Datei):
var menu="<a href=´link1.html´ target=´blank´>Link 1</a><br><br><a href=´link2.html´ target=´blank´>Link 2</a>";


PS: weitere Infos: http://de.selfhtml.org/javascript/intro.htm#javascriptdateien

PS1: das language-Attribut wird nicht mehr verwendet und erzeugt nicht-valides HTML.

PS2: und wer JS deaktiviert hat (z.B. Suchmaschinenrobots) kommt eben nicht auf die Unterseiten.

Antwort 3 von steirer

erstmal danke für die hilfe.

deluxestyle: einbinden mit menu.js konnte ich schon, die genaue syntax war mir fremd; vor allem der zweite teil.

rfb: das einbeinden des zweiten teils
<script type="text/javascript">document.write(menu);</script>
hat geholfen, nun funktioniert´s.

allerdings ergibt sich nun ein neues problem: mein so schön eingebettes externes css

<link rel=stylesheet type="text/css" href="flugzvorl.css">

ist nun bei den links zum teufel.
die links kümmern sich einen schmarren um die css-anweisung

A{text-decoration:none;} A:Hover{text-decoration:underline;} A:link{color:#00ffff;}
A:visited{color:#996699;} A:active{color:#cc0066;}

wie krieg ich das nun wieder hin?

Antwort 4 von rfb

ohne deinen Code zu kennen lässt sich das kaum beantworten.

Antwort 5 von steirer

rfb - was meinst du nun mit code?

die ggstdl. (vereinfachte) html sieht so aus:

<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link rel=stylesheet type="text/css" href="flugzvorl.css">
<script language="JavaScript" src="menu.js"></script>
</head>
<body bgcolor="#FFFFFF" text="#006600">
text
<br>
text
<br>
text
<br>
<script type="text/javascript">document.write(menu);</script>
</body>
</html>

die externe css funktioniert nicht, wenn das menu über externes js eingebunden ist.

Antwort 6 von rfb

das CSS wäre in diesem Zusammenhang nicht uninteressant.

Antwort 7 von steirer

hi rfb,

...aber das css steht schon in meiner "antwort 3" ?

Antwort 8 von rfb

Zitat:
...aber das css steht schon in meiner "antwort 3" ?
Ach so! (das bisschen hatte ich nicht ernst genommen. ;-)

Die Angaben zu Links gehören in eine festgelegte Reihenfolge, schau mal hier:
http://de.selfhtml.org/css/eigenschaften/pseudoformate.htm#link_vis...

Antwort 9 von steirer

na ja,

das ´bisschen´ hat bislang prima funktioniert - allerdings ohne die menu.js, mit der hat der schlamassel angefangen.

du bist allerdings ein genie, mit der änderung der reihenfolge klappt´s!

warum steht sowas eigentlich nicht in selfhtml, daß auch die reihenfolge so wichtig ist? ist doch sonst ´ne großartige hilfe.

jedenfalls nochmals danke für die mühe.

Antwort 10 von rfb

Sorry, war nicht beleidigend gemeint.
Übrigens - die angegebene Stelle ist aus SelfHTML ;-)

Ich würd dir empfehlen, die Angaben zum Body ebenfalls in die CSS-Datei zu packen:
body {background:#ffffff;color:006600}

und aus dem body-tag zu streichen

Antwort 11 von steirer

Ich bin gar nicht beleidigt,

daß der Hinweis aus selfhtml ist, hab´ ich auch überlauert, ich mein´ aber daß an jener Stelle bei selfhtml nicht darauf hingewiesen wird, so sklavisch die Reihenfolge einzuhalten ... das hat mich verwundert, denn ansonsten ist selfhtml eine große Hilfe (gerade auch für mich Autodidakten), mit sehr präzisen Vorgaben.
Ich hab´ da auch sowas tolles gefunden wie den Statuszeilen-Text per JS, aber - und das ist nun der nächste Wurm (wenn ´mal wo der Teufel drin is´, dann gleich mit sieben Jungen), wenn ich die Anweisungen exakt so ins externe JS schreib´, wie sie noch in der html-datei stehen

<a href="help.htm" onMouseOver="window.status=´Help/Hilfe´; return true" onMouseOut="window.status=´´; return true" title="Help/Hilfe" style="cursor:help;">Help</a>

dann funktioniert wieder gar nix. Ich verzweifel noch so langsam ... ich weiß wieder nicht, kann ich die Anweisung

return true´´

weglassen, oder ist es ´was anderes, was sich spießt.

Das sind halt die Grenzen als Autodiakt, wenn js und css jeweils anders zu schreiben sind (die Zeichensetzung nämlich) wenn man´s in html einbindet, oder extra in eine ausgelagerte Datei.

Daß die Anweisungen für Hintergrund und Schriftfarbe noch in der html stehen, kommt aus der Vergangenheit ... mit WIN95 dauerte der Aufbau der externen css-Datei etwas, und damit die Hintergrundfarbe nicht "wackelt" hab´ ich´s damals zusätzlich ins html getippt. Muß ich auch noch korrigieren.

Antwort 12 von rfb

Mit
window.status
gibts jede Menge Probleme, die in jedem Browser und dann auch noch je nach Browsereinstellungen variieren (selbst das SelfHTML-Beispiel funktioniert nur in einem meiner 3 gerade greifbaren Browser).

Tipp: Lass es, die Mühe lohnt sich nicht.
Nutze lieber (wie in deinem Beispiel) das
title
-Attribut, das ein kleines Tooltipp-Fenster über dem Link erzeugt, in dem du den Text genausogut bzw. zuverlässiger anzeigen lassen kannst. Außerdem funktioniert
title
bei (fast) allen tags und auch ohne JavaScript.

Ich möchte kostenlos eine Frage an die Mitglieder stellen:


Ähnliche Themen:


Suche in allen vorhandenen Beiträgen: