nicht angemeldet
DHTML/CSS - Dynamische Navigationsleiste - oben!
Ich habe die Beispiel-Navigationsleiste (dynamisch, DHTML) aus SelfHTML entnommen und in mein Projekt eingebaut.
Ich habe' das ganze verändert und angepasst - zu erst habe ich die .gif auf meine Bedürfniss angepasst und dann die Leiste nicht links, sondern in der oberen rechten Ecke platziert, und von oben nach unten aufploppen lassen (wenn man an den oberen Rand kommt)
Soweit funktioniert das alles fein.
Mein Problem ist nun folgendes:
Beim "Original" ist die Position der Leiste ja fix, sprich, egal wie weit man scrollt, die Leiste bleibt links erhalten.
Das passt bei mir nun garnicht. Ich scrolle, aber die Leiste klebt oben fest. Ich hätte auch gern die Variante, das ich scrolle, aber trotzdem immer Zugriff auf die Navigation habe. (halt am oberen Rand)
Welche Veränderungen zum Original sind von Nöten?
-
Ich habe die Beispiel-Navigationsleiste (dynamisch, DHTML) aus SelfHTML entnommen und in mein Projekt eingebaut.
Schön!
Beim "Original" ist die Position der Leiste ja fix, sprich, egal wie weit man scrollt, die Leiste bleibt links erhalten.
Das passt bei mir nun garnicht.Dann hast du sie wohl doch nicht richtig angepasst.
Ich scrolle, aber die Leiste klebt oben fest. Ich hätte auch gern die Variante, das ich scrolle, aber trotzdem immer Zugriff auf die Navigation habe. (halt am oberen Rand)
Vl liegts daran, dass ich gerade einen Brainfreeze vom Eisshake habe aber ist dieser Satz nicht selbstwidersprechend?
--
Lg,
Snafu-
Hallo,
Vl liegts daran, dass ich gerade einen Brainfreeze vom Eisshake habe aber ist dieser Satz nicht selbstwidersprechend?
Du darfst halt nicht immer nur das lesen, was da steht, sonder auch das was zwischen den Zeilen steht, also Nachdenken, was er damit meinen könnte.
gruß aus Hosena
-
Hallo,
Vl liegts daran, dass ich gerade einen Brainfreeze vom Eisshake habe aber ist dieser Satz nicht selbstwidersprechend?
Du darfst halt nicht immer nur das lesen, was da steht, sonder auch das was zwischen den Zeilen steht, also Nachdenken, was er damit meinen könnte.gruß aus Hosena
Wie freundlich man hier empfangen wird... na egal, darum geht's ja net.
Das position: fixed ist schon auf absolute, war ja auch so vorgegeben.
Das ganze sieht so aus:
#Nav { position:absolute; top:0px; left:50px; visibility:hidden;}
#NavOben { position:absolute; top:0px; left:50px; }
#Nav a:link {color:#AFB4BE; font-weight:bold; font-size:17.5px; text-decoration:none; }
#Nav a:visited { color:#AFB4BE; font-weight:bold; font-size:17.5px; text-decoration:none; }
#Nav a:hover { color:#666666; background-color:#AFB4BE; font-weight:bold;
font-size:17.5px; text-decoration:none; }
#Nav a:active { color:#AFB4BE; font-weight:bold; font-size:17.5px; text-decoration:none; }Nur pixel-mäßig angepasst - Ausrichtung.
Das ganze muss irgendwo hier liegen:
function Menue () {
if (typeof window.pageYOffset == "number") {
if (NS4) {
getElement("id", "Nav").left = window.pageYOffset + 493;
} else {
getElement("id", "Nav").style.left = window.pageYOffset + 493;
}
} else {
if (typeof document.body.scrollLeft == "number")
getElement("id", "Nav").style.left = document.body.scrollLeft + 493;
}
if (OP)
getElement("id", "NavLinks").style.pixelLeft = NavLinksPos;
if (NS4) {
getElement("id", "Nav").visibility = "show";
} else {
getElement("id", "Nav").style.visibility = "visible";
}
}Wie gesagt, in dem Bereich bin ich noch Voll-n00b und hab' nur vorgegebene Sachen editiert ._."
-
Hallo!
Wie freundlich man hier empfangen wird... na egal, darum geht's ja net.
War nicht böse gemeint. Mit ein paar Emoticons wäre es vl richtig rübergekommen.
Das ganze muss irgendwo hier liegen:
function Menue () { ...
Ich vermute mal, dass das ein Workaround für position static war (habs mir nicht genau angeschaut). Was passiert denn, wenn du das weglässt?
--
Lg,
Snafu-
Hallo!
Wie freundlich man hier empfangen wird... na egal, darum geht's ja net.
War nicht böse gemeint. Mit ein paar Emoticons wäre es vl richtig rübergekommen.Das ganze muss irgendwo hier liegen:
function Menue () { ...
Ich vermute mal, dass das ein Workaround für position static war (habs mir nicht genau angeschaut). Was passiert denn, wenn du das weglässt?Der Beschreibung nach ist die Funktion Menue() dafür verantwortlich, dass das Menü immer im sichtbaren Bereich des Dokumentes/der HTML-Seite bleibt.
Wenn ich das ganze weglasse, klappt das Menü nicht mehr auf >_<
Die Lösung ist bestimmt ganz einfach... irgendwie :)
-
Ich hab', wie Maxx beschrieben, alles in den Urzustand versetzt und nur die Kleinigkeiten geändert.
Nun bin ich wieder da, das es generell klappt, dass heißt aufklappt, sobald ich mich dem oberen Rand nähere, etc.Das ganze funktioniert auch, sobald ich etwas nach unten scrolle. Das Menü klappt auf, aber zu sehen wäre es nur ganz oben im Dokument (ich habe wenig gescrollt, bin mit Mauszeige gen oberen Rand, Menü klappte auf, habe nur unteren Rand der Menü-gif-Grafik gesehen)
Soweit, so gut. Nun soll die Grafik (das gif) aber jeweils vollständig zu sehen sein, egal wie weit "unten" im Dokument ich mich befinde.
Das ist nun der letzte Knackpunkt und ich habe fest die Befürchtung, dass das so nicht gehen wird :/VIelleicht wird's mit Screenshots verständlicher, komm' ja bei meinen Texten teilweise selbst nicht hinterher ^^"
http://img84.imageshack.us/img84/2312/okayoi4.jpg
So ist es schön, und es funzt auch alles.http://img206.imageshack.us/img206/6844/mistak2.jpg
So ist es Mist. Man sieht oben, dass sich das Menü zwar geöffnet hat, aber es sollte auch an dieser - und jeder weiteren Stelle - komplett sichtbar sein.So.
Danke schonmal für die Hilfe ^_^
-
Hallo,
Das ganze funktioniert auch, sobald ich etwas nach unten scrolle. Das Menü klappt auf, aber zu sehen wäre es nur ganz oben im Dokument
ok, prinzipiell "sollte" es gehen, ohne das du am javascriptcode etwas änderst. Mir ist da aber gerade noch etwas aufgefallen.
Dein Testdokument hat einen <!DOCTYPE ... ?
Wenn ja, entferne den bitte mal und mach einen Test ob's dann klappt und melde dich wieder.
Grüße,
Jochen
-
Hallo,
Das ganze funktioniert auch, sobald ich etwas nach unten scrolle. Das Menü klappt auf, aber zu sehen wäre es nur ganz oben im Dokument
ok, prinzipiell "sollte" es gehen, ohne das du am javascriptcode etwas änderst. Mir ist da aber gerade noch etwas aufgefallen.
Dein Testdokument hat einen <!DOCTYPE ... ?
Wenn ja, entferne den bitte mal und mach einen Test ob's dann klappt und melde dich wieder.
Grüße,
Jochen
._.""
Daran lag's wohl - klappt jetzt.
Bah, ich wußte doch gleich, dass es sowas popliges sein wird.Danke an alle!
-
Hallo,
Wenn ja, entferne den bitte mal und mach einen Test ob's dann klappt und melde dich wieder.
Daran lag's wohl - klappt jetzt.
Haaaalt! Nicht so schnell. Mit dem fehlenden DOCTYPE handelst du dir wesentlich größere Fehler ein. Soll heißen, dein Layout "funzt" im IE, ist aber im Firefox oder Opera total verschoben.
Du musst nun doch in den javascriptcode eingreifen. Ich bin mir nicht 100%ig sicher, vielleicht liest Mathias mit und korrigiert mich ...
nach der Stelle:
if (typeof document.body.scrollTop == "number") { getElement("id", "Nav").style.top = document.body.scrollTop + 50; }ergänze bitte ein:
if (typeof document.documentElement.scrollTop == "number") { getElement("id", "Nav").style.top = document.documentElement.scrollTop + 50; }weiterhin musst du alle numerischen Angaben im javascript mit der Maßeinheit ergänzen. Also überall dort wo top oder left oder YOffset
verwendet wird. Beispielsweise... = document.body.scrollTop + 50;
-> ... = document.body.scrollTop + 50+"px";Viele Grüße,
Jochen
-
Hallo,
Wenn ja, entferne den bitte mal und mach einen Test ob's dann klappt und melde dich wieder.
Daran lag's wohl - klappt jetzt.
Haaaalt! Nicht so schnell. Mit dem fehlenden DOCTYPE handelst du dir wesentlich größere Fehler ein. Soll heißen, dein Layout "funzt" im IE, ist aber im Firefox oder Opera total verschoben.
Du musst nun doch in den javascriptcode eingreifen. Ich bin mir nicht 100%ig sicher, vielleicht liest Mathias mit und korrigiert mich ...
nach der Stelle:
if (typeof document.body.scrollTop == "number")
{
getElement("id", "Nav").style.top = document.body.scrollTop + 50;
}> > ergänze bitte ein: > > ~~~javascript if (typeof document.documentElement.scrollTop == "number") > { > getElement("id", "Nav").style.top = document.documentElement.scrollTop + 50; > }weiterhin musst du alle numerischen Angaben im javascript mit der Maßeinheit ergänzen. Also überall dort wo top oder left oder YOffset
verwendet wird. Beispielsweise... = document.body.scrollTop + 50;
-> ... = document.body.scrollTop + 50+"px";Viele Grüße,
Jochen
Jo, passt jetzt so, auch mit DOCTYPE ;)
-
-
-
-
-
-
-
Hallo,
Das ganze sieht so aus:
function Menue () {[...]
ohje, du hast viel zu viel geändert. Da stimmt leider nichts mehr.
Überlege doch mal: Ob das Menü am linken Bildschirmrand oder am oberen macht von der Berechnung der Y-Koordinate (denn genau das Macht die Funktion Menue) erst mal keinen Unterschied. Denn auch beim Original "rutscht" das Menü je nach Scrollposition mit nach unten. Den gleichen Effekt willst du ja auch haben, oder?Also ändere erst mal nur die handleMove() um den Mauszeiger entsprechend nicht links, sondern oben abzufragen.
Wenn das klappt ändere das CSS so ab, dass das Menü in X-Richtung verschoben wird.
#Nav { position:absolute; top:50px; left:0; visibility:hidden; }dafür ist
left:0;verantwortlich.Viel Spaß damit. Und denke daran immer nur kleine Änderungen zu machen und anschließend zu kontrollieren. So kannst du einen fehler sofort erkennen. Und weißt genau wo er verursacht wird.
Grüße,
Jochen
-
Hallo,
function Menue () {
if (typeof window.pageYOffset == "number") {
if (NS4) {
getElement("id", "Nav").left = window.pageYOffset + 493;
} else {
getElement("id", "Nav").style.left = window.pageYOffset + 493;
}
} else {
if (typeof document.body.scrollLeft == "number")
getElement("id", "Nav").style.left = document.body.scrollLeft + 493;
}Was passiert, wenn du den oberen Teil weglässt?
if (OP)
getElement("id", "NavLinks").style.pixelLeft = NavLinksPos;
if (NS4) {
getElement("id", "Nav").visibility = "show";
} else {
getElement("id", "Nav").style.visibility = "visible";
}
}gruß aus Hosena
-
-
-
-
Hallo,
Irgendwo in deiner CSS muss ein position:fixed stehen und das schaltest du auf position:absolute um. Wenn das nicht geht dann poste bitte deine css-Datei.
gruß aus Hosena