Navigation-Problem!
09.12.10, 21:10:53
Doppelwhopper55
Hallöchen,
denke mal das Jürgen hier der richtige Mann ist.
Hab mir bei Self-Html eine nette Navigation ausgesucht, bzw. mein Schwiegersohn.
Sie sollte so
FUNKTIONIEREN
Tut sie aber nicht, also bei mir. Ich denke ich hab alles korrekt ugbebastelt und die entsprechenden Gif's auf den Server gepackt.
Klappt einfach nicht aus, da muss ich mal den Profi ran lassen :wink:
Hier der Code:
Code:
001:
002:
003:
004:
005:
006:
007:
008:
009:
010:
011:
012:
013:
014:
015:
016:
017:
018:
019:
020:
021:
022:
023:
024:
025:
026:
027:
028:
029:
030:
031:
032:
033:
034:
035:
036:
037:
038:
039:
040:
041:
042:
043:
044:
045:
046:
047:
048:
049:
050:
051:
052:
053:
054:
055:
056:
057:
058:
059:
060:
061:
062:
063:
064:
065:
066:
067:
068:
069:
070:
071:
072:
073:
074:
075:
076:
077:
078:
079:
080:
081:
082:
083:
084:
085:
086:
087:
088:
089:
090:
091:
092:
093:
094:
095:
096:
097:
098:
099:
100:
101:
102:
103:
104:
|
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Amazonencorps-Frechen</title>
<meta name="description" content="Tanzen Spass und Karneval">
<meta name="author" content="Amazonencorps">
<meta name="keywords" content="Amazonencorps Frechen">
<meta name="keywords" content="Tanzengruppen Frechen">
<meta name="robots" content="index, follow">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="dhtml.js"></script>
<script type="text/javascript">
function Menue () {
if (typeof window.pageYOffset == "number") {
if (NS4) {
getElement("id", "Nav").top = window.pageYOffset + 50;
} else {
getElement("id", "Nav").style.top = window.pageYOffset + 50;
}
} else {
if (typeof document.body.scrollTop == "number")
getElement("id", "Nav").style.top = document.body.scrollTop + 50;
}
if (OP)
getElement("id", "NavLinks").style.pixelTop = NavLinksPos;
if (NS4) {
getElement("id", "Nav").visibility = "show";
} else {
getElement("id", "Nav").style.visibility = "visible";
}
}
function noMenue () {
if (NS4) {
getElement("id", "Nav").visibility = "hide";
} else {
getElement("id", "Nav").style.visibility = "hidden";
}
}
function handleMove (ev) {
if (!ev)
ev = window.event;
var mausposition = ev.pageX ? ev.pageX : ev.clientX;
if (mausposition < 20) {
Menue();
} else {
if (mausposition > 250) {
noMenue();
}
}
}
function Event_init () {
if (document.addEventListener) {
document.addEventListener("mousemove", handleMove, true);
} else {
if (NS4) {
document.captureEvents(Event.MOUSEMOVE);
document.onmousemove = handleMove;
} else {
document.body.onmousemove = handleMove;
}
}
if (OP) {
NavLinksPos = 42; // Position des Bereiches NavLinks
getElement("id", "NavLinks").style.pixelTop = NavLinksPos;
}
}
</script>
<style type="text/css">
body { color:black; background-color:red; background-image:url(http://www.amazonencorps-frechen.de/bilder/navigation_back.gif);
margin:0; padding:20px 50px; font-family:Tahoma,sans-serif; }
#Nav { position:absolute; top:50px; left:0; visibility:hidden; }
#NavLinks { position:absolute; top:42px; left:42px; }
#Nav a:link {color:#000080; font-weight:bold; font-size:13px; text-decoration:none; }
#Nav a:visited { color:#000080; font-weight:bold; font-size:13px; text-decoration:none; }
#Nav a:hover { color:#FFFFFF; background-color:#000080; font-weight:bold;
font-size:13px; text-decoration:none; }
#Nav a:active { color:#000080; font-weight:bold; font-size:13px; text-decoration:none; }
</style>
</head>
<body onload="Event_init()">
<div id="Nav">
<img src="http://www.amazonencorps-frechen.de/bilder/navigation.gif" width="250" height="450" border="0" alt="">
<div id="NavLinks">
<a href="http://www.amazonencorps-frechen.de">Home</a><br>
<a href="http://www.amazonencorps-frechen.de">Leer</a><br>
<a href="http://www.amazonencorps-frechen.de">Leer</a><br>
<a href="http://www.amazonencorps-frechen.de">Leer</a><br>
</div>
</div>
<h3><< Navigation </h3>
<center><img src="http://www.amazonencorps-frechen.de/bilder/plakat.jpg" /></center>
</body>
</html>
|
Vielleicht findet ihr ja was :wink:
10.12.10, 01:54:13
Lighty
Hallo Franz !
Wo hast du denn die Datei "dhtml.js" hingepackt !?
... und ein Beispiel wie es aussehen soll wäre gut ! ;)
10.12.10, 06:46:01
Doppelwhopper55
Moin Jürgen,
hmm.....also ein dhtml.js habe ich nirgendwo hingepackt. Hab ja gar keine :wink:
So wie ich das hier
http://de.selfhtml.org/dhtml/beispiele/navigation.htm#quelltext
verstanden hatte ist das im Script eingebaut.
Aber ich glaub ich weiß was du meinst. In Zeile 13 wird auf eine Quelle verwiesen und ab Zeile 14 ist der eigentliche script nochmals aufgeführt. Das kann sich natürlich beißen.
Aussehen soll das wie im Anzeigevorschau in obigem Link, allerdings halt in unserem roten Layout.
Da ich auf Arbeit bin kann ich das im Moment nicht testen :wink:
Wo krieg ich denn die .js her? Das Script als dhtml.js Datei abspeichern und in den Html Ordner des Serves packen?
10.12.10, 10:07:27
Lighty
Moin Franz !
Wenn du die Datei hast, läuft es ! ;)
http://www.j-remmer.de/doppelwhopper/
Die Datei gehört Standard in das gleiche Verzeichnis wo auch die index liegt !
Du kannst aber auch einen Ordner, z.B. "scripts" erstellen und die Datei da rein packen !
Zeile 14 dann entsprechend ändern ! ;)
<script type="text/javascript" src="scripts/dhtml.js"></script>
Datei, dhtml.js, gepackt im Anhang !
10.12.10, 13:45:15
Doppelwhopper55
Supi,
das werd ich dann gleich mal testen zu Hause. Danke schön erst mal :grin:
Was allerdings jetzt nicht klappte, war dass bei runtergescrollter Seite das Menü sich trotzdem im aktuellen Bereich öffnet. Konnte ich hier im Netbook gut sehen da ich hier einiges scrollen muss um ans Ende der Seite zu gelangen.
Das Menü öffnet sich, aber an der Standardposition oben.
10.12.10, 16:50:37
Doppelwhopper55
HILFE????
wie krieg das ganze Umlautfähig???? Sonst muss ich einen ellenlangen Text umschreiben....... :grmpf:
10.12.10, 17:20:12
Lighty
Hallo Franz !
Die Position ist "fix" - steht aber auch auf der Seite ! ;)
Zitat:
Und jetzt kommen noch etliche leere Absätze, damit auch sichtbar wird, dass das Menü immer an der gleichen Stelle angezeigt wird, egal wie weit man scrollt.
Umlaute werden per Ampersands angegeben ! ;)
& nbsp; - Leerzeichen
& auml; - kleines ä
& Auml; - großes Ä
& ouml; - kleines ö
& Ouml; - großes Ö
& uuml; - kleines ü
& Uuml; - großes Ü
& szlig; - ß
( Angabe natürlich ohne Leerzeichen ) ;)
10.12.10, 17:59:42
Doppelwhopper55
Orginalbeitrag Lesen
Hallo Franz !
Die Position ist "fix" - steht aber auch auf der Seite ! ;)
Zitat:
Und jetzt kommen noch etliche leere Absätze, damit auch sichtbar wird, dass das Menü immer an der gleichen Stelle angezeigt wird, egal wie weit man scrollt.
Hmm....mit den Leerabsätzen war ja nur zu Demozwecken. Viellicht liegts daran das im Mom auf der Startseite nur das Jpg ist. Mal sehen wie es sich verhält wenn da Text o.ä. steht.
Zitat:
Umlaute werden per Ampersands angegeben !
Naja, genau das umschreiben wollte ich mir sparen. Bei Npage die hatten mir einen Metatag mitgeteilt der das Problem gelöst hat. war irgendwas mit Charset.
Von daher war ich jetzt etwas überrascht das das es nicht umgesetzt wurde. Da dieses UTF 8 ja im Code drin ist :sad:
10.12.10, 18:03:41
Doppelwhopper55
Jepp
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
genau diesen Tag habe ich seinerseits bekommen und alle Umlaute wurden angezeigt?!?
10.12.10, 18:10:45
Merlin
genau das umschreiben wollte ich mir sparen
Nimm
Notepad++ und nutze die Suchen & Ersetzen-Funktion. Suchen nach:
ä, Ersetzen mit
& auml; (ohne Leerzeichen). Das auch für Großbuchstaben und alle anderen Umlaute.
10.12.10, 18:18:00
Lighty
... jüpp, Editor benutzen und ggf. autom. umwandeln !
( Windows Notepad, Notepad ++ / Linux kwrite, gedit )
Es wird auch generell empfohlen die Ampersands zu verwenden !
( bessere Kompatibilität mit anderen Systemen und/oder Datenbanken )
10.12.10, 18:20:12
Doppelwhopper55
Okay, ich geb mich geschlagen :wink:
Denke ihr hört dann so in 5 Jahren wieder von mir...... :lol1:
