Hallo BeRo,

zunächst einmal vielen Dank für Deine Antwort.

Schade eigentlich! Dann macht ja die MouseOver-Ebene für die NavBar gar keinen Sinn... Na gut, dann erstmal ohne Mouse-Over-Effekt...

Ich habe die NavBar aufgelöst und die MouseOver-Ebene des Menüs gelöscht. Anschließend die Ebene Menu auf alle Seiten kopiert. Jetzt "verliert" der letzte Menüpunkt aus unerfindlichen Gründen seinen Link... Oder anders gesagt: auf die letzte Seite kann aus dem Menü nicht verlinkt werden. Ich habe eine Seite am Ende hinzugefügt, aus der nicht aus de4m Menü verlinkt werden muss (z. B. Impressum), und schon funktioniert es...

Das Kopieren des Menüs auf alle Seiten hätte ich mir sparen können - sie werden Seite für Seite übereinandergestapelt. Am Ende sehe ich also immer das Menü der letzten Seite .

Den Mouse-Over-Effekt könnte ich nun noch mühsam mit Popup-Ebenen nachbasteln. Aber spätestens beim Scrollen mache ich dann ein langes Gesicht, weil auch hier die aktuelle Seite immer im Menü hervorgehoben sein muss (siehe Template-Beispiel oben). Das wird also nix...

Müssen wir wohl auf WD11 hoffen... Ich konnte aber noch keine Gerüchteküche finden, in der über die künftige Version etwas zu lesen ist.

Viele Grüße
Michael

[...] Schade eigentlich! Dann macht ja die MouseOver-Ebene für die NavBar gar keinen Sinn [...]

Das könnte man meinen...
Du vergisst dabei aber, dass das !FixedTab Tweak nicht von Magix/Xara kommt sondern von einem findigen User.
Hier wurde das im englischen talkgraphics Forum vorgestellt, vor dem Hintergrund, Objekte auf der Seite zu fixieren. Dass damit auch eine NavBar fixiert werden kann ist klar, wenn man die Einschränkungen akzeptiert.

[...] Ich habe die NavBar aufgelöst und die MouseOver-Ebene des Menüs gelöscht.

Es geht auch ohne diese "Klimmzüge", wenn Du auf das !FixedTab Tweak verzichtest.

Die etwas aufwändigere (aber funktionierende) Alternative basiert auf der Methode, separate Objekte in einen iframe einzubinden.
Diese Objekte können aus dem aktuellen Projekt kommen (z. B. eine komplette HTML Seite) oder von einem anderen Server im WWW.

Wie das geht, das habe ich schon in etlichen Threads beschrieben. Einen Einstieg mit weiterführenden Links und mit einer online Demo findest Du hier.

So kannst Du das umsetzen, wenn Du eine voll funktionsfähige NavBar (mit MouseOver Effekt) einbinden willst:

• Neue-, absolut leere Seite erstellen, die die Größe der NavBar hat und die komplette NavBar dahin kopieren (inkl. MouseOver Ebene)
  
  
   
• Auf der Seite, die die NavBar zeigen soll, den folgenden JS Code im HTML Body ablegen:
  -------------------------
  <div style="position:fixed; top: 100px; left:5px;">
  <iframe src="grafik.htm" name="NavBar" width="100px" height="124px" scrolling="no" marginheight="0" marginwidth="0" frameborder="0"> </iframe>
  </div>
  ------------------------
  Im o. a. Code sind die Werte grün markiert, die die (fixierte) Position der NavBar auf der fertigen Seite bestimmen:
  Der oben gelb markierte Name steht für den Namen der Seite, auf der Du die NavBar angelegt hast. Im Beispiel ist das die Seiten "grafik.htm"
  So sieht das im Editor aus:
  
  
   
• Fertig!
  
  Das Ergebnis kann so aussehen:
  
  

Wenn dazu noch Fragen auftreten, nur her damit.

Viel Erfolg

Hallo BeRo,

an den IFrame hatte ich auch schon gedacht und nach Deinem Tipp jetzt auch ausprobiert.

Da es sich ja um eine Seiteneffekt-Website handelt, kann ich die Seite mit der NavBar natürlich nicht im selben Projekt anlegen. Also als neues Projekt anlegen. Dann habe ich aber das Problem, dass ich die Links zu den Seiten nicht so einfach einstellen kann. Erstens sind die Seiten in diesem NavBar-Projekt ja gar nicht vorhanden , zweitens stimmt die Notation nicht. Es braucht eine relative Adressierung (z. B.: ./index.htm#xl_xr_page_seitename) .

Dennoch funktionieren nach dem Einbinden der NavBar die Links nicht, obwohl ich an den Adressen keinen Fehler entdecken kann.

Schließlich habe ich noch ein kleines Problem mit der Positionierung der Navbar. Position TOP ist klar, aber für die horizontale Position fehlt mir der Parameter, da relativ zum Browserfenster positioniert wird und nicht vom Rand der Webseite. Aber das liegt wohl daran, dass ich kein CSS-Experte bin .

Fazit: so ganz ist es das auch noch nicht...

[...] Da es sich ja um eine Seiteneffekt-Website handelt, kann ich die Seite mit der NavBar natürlich nicht im selben Projekt anlegen. [...]

Du hattest ja schon in der Threaderöffnung geschrieben, dass Du eine Seiteneffekt Website erstellst, aber das habe ich bei meinen Tipps nicht realisiert.

[...] Also als neues Projekt anlegen. [...] Dennoch funktionieren nach dem Einbinden der NavBar die Links nicht. [...]

So, wie Du es gemacht hast, ist es absolut korrekt. Dass die Links nicht funktionieren könnte daran liegen, dass Du sie nicht im "Elternfenster" öffnen lässt.
So wäre es richtig:

Um die extern liegende NavBar in der Seiteneffekt Site zu fixieren, brauchst Du keinen Platzhalter. Es genügt, den entsprechenden Code (CSS + iframe) in den HTML Body der Website (nicht der Seite) zu legen.

So kann der Code aussehen:

---------------------------------
<style type="text/css">
#f1 {position: fixed; left: 50%; margin-left: -380px; top:20px;}
</style>

<div id="f1">
<iframe width= "346px" height="27px" allowtransparency="true" scrolling="no" frameborder="0" src="./fixmenu.htm" style="display: block;" align="left">
</iframe>
</div>
---------------------------------

Im Code grün markiert ist der Name der extern liegenden NavBar. Blau markiert sind die Abmessungen der NavBar.

[...] für die horizontale Position fehlt mir der Parameter [...]

Im o. a. Code sind die Einstellungen gelb markiert, mit denen Du die horizontale Position festlegen kannst.
Die Einstellung "left: 50%" sorgt dafür, dass die linke Kante der NavBar genau in der horizontalen Mitte eingeblendet wird.
Die Einstellung "margin-left: -380px" definiert den Versatz der NavBar nach links, um 380px. Der Negativwert kann etwa die Hälfte der eingestellten Seitenbreite betragen, wenn die NavBar am linken Rand der Seite zu sehen sein soll.

So praktisch die Fixierung der NavBar ist, ist die Funktion nicht in allen Browsern gleich. Im FireFox ist es z. B. nicht möglich, die einmal aufgerufene Seite wieder sichtbar zu machen, wenn man zwischenzeitlich manuell auf eine andere Seite scrollt. Der IE hat zeigt dieses Problem nicht.

Aber das ist wohl nur ein Schönheitsproblem...

Viel Erfolg beim Nachbau

Hallo BeRo,

Du machst hier so einen Super-Job, da kann man auch mal eine Kleinigkeit übersehen... ;-)

Dein Link-Tipp mit dem Elternfenster war goldrichtig, die Navigation inkl. Mouse-Over funktioniert damit.

Unschön finde ich, dass das Menü nicht den aktuell ausgewählten Menüpunkt anzeigt (nicht einmal beim Start auf index.htm). Dass das Menü beim Scrollen entsprechend reagiert konnte ich natürlich nicht erwarten.

Dennoch: Dank Deiner tollen Unterstützung habe ich mal wieder eine Menge gelernt.

Vielen Dank & beste Grüße
Michael

[...] Unschön finde ich, dass das Menü nicht den aktuell ausgewählten Menüpunkt anzeigt [...]

Das Problem hatten wir schon in einigen anderen Threads und bisher gab es dafür keine 100% Lösung.

Bisher!

Wenn man sich die Site mit der fixierten NavBar ansieht, findet man eine normale (Seiteneffekt) Website ohne NavBar und eine separate Site, die auf einer Seite eine einzelne NavBar enthält, die per iframe in die Hauptseite eingebunden wird.

Gehen wir mal davon aus, dass unsere Website aus drei Seiten besteht, dann sollte es auch drei verschiedene NavBar Seiten geben, auf denen die jeweils aktiven Hauptseiten per MouseOver Effekt signalisiert werden.

Das Einbinden dieser NavBar Objekte per iframe Code wäre in einer normalen Website kein Problem, in einer Seiteneffekt Website funktioniert das aber nicht, da ja nur eine "index.htm" Datei erzeugt wird und die kann nun mal nicht drei verschiedene NavBar Objekte referenzieren...

Die Lösung muss also mit einem einzubindenden Objekt möglich sein und genau darauf basiert mein Lösungsvorschlag:

• Wir benötigen eine Website, die (für unser Beispiel) aus drei Unterseiten besteht, die  jeweils nichts anderes enthalten, als eine ganz normale NavBar mit MouseOver Effekt.
• Die Links der einzelnen Buttons zeigen ganz normal auf die anderen Seiten der (NavBar) Website.
  Im Gegensatz zur ursprünglichen Lösung dürfen diese Links aber nicht im "Elternfenster" (_parent) geöffnet werden!
  Die Beschriftung der Buttons muss sich natürlich auf die Seiten der Haupt Website beziehen.
• Jede (NavBar) Unterseite bekommt zusätzlich im HTML Body ein paar Zeilen JavaScript die dafür sorgen, dass beim Öffnen einer (NavBar) Seite, die dazu passende Unterseite der (Seiteneffekt) Haupt Website geöffnet wird.
  --------------------------
  <script type="text/javascript">
  function link1() {
  top.location.href='./index.htm#xl_xr_page_index';
  }
  </script>

  <body OnLoad="link1()">
  --------------------------
  Die Funktionsnamen (oben blau markiert) müssen auf jeder Seite anders sein.
  Der im Code grün markierte Teil sorgt dafür, dass angegebene Seite (gelb markiert) im gleichen Fenster geöffnet wird.

• Im HTML Body der Haupt Website ist die NavBar Website per iframe Code eingebunden (wie unten erklärt) und auf der Seite fixiert.

• Da die NavBar Site wie eine ganz normale Website funktioniert, zeigen die Buttons der NavBar beim Aufruf einer Seite automatisch den gewünschten MouseOver Zustand, der solange erhalten bleibt, bis ein anderer NavBar Button geklickt wird und damit die Seite gewechselt wird.

Die Änderungen, die Du machen musst sind also überschaubar. Der Effekt sollte aber nichts zu wünschen übrig lassen.

Viel Erfolg

Ja, die Änderungen sind überschaubar - der Erfolg allerdings auch .

Grundsätzlich funktioniert die Anzeige des aktuellen Menüpunktes nun recht zuverlässig. Nur wenn man allzu "hektisch" klickt, verliert der Button offenbar ab und zu den Fokus und die Markierung verschwindet. Konkret muss die Maus den Button wieder verlassen haben, bevor die NavBar geladen ist.

Die größeren Probleme kommen jetzt:

1. Es wird zwar die korrekte NavBar-Seite aufgerufen, der Aufruf per Javascript funktioniert aber nicht. Um sicher zu gehen, dass ich keinen Schreibfehler habe, habe ich den Code einfach mal in die Seiteneffekt-Seite kopiert. Und siehe, hier funktioniert es.
   Ist es nicht so, dass die Navbar-Seite weiterhin die Adressen der Seiteneffekt-Seite nicht kennen kann?
2. Natürlich kann das Markieren des aktiven Menüpunktes beim Scrollen nicht funktionieren.
3. Und auch das Verhalten der Seiteneffekt-Seite mit einem sanften Scroll-Effekt scheint mit dieser Lösung nicht nachbildbar zu sein.

Mache ich bei Punkt 1. gerade einen Gedankenfehler???

Viele Grüße
Michael

[...] Die größeren Probleme kommen jetzt: [...] 1. [...] 2. [...] 3. [...]

Hmmm, da haben wir offenbar 2 verschiedene Lösung kreiert. Ich kann bei meinem Demoprojekt jedenfalls nichts von diesen Problemen sehen. Vielleicht bin ich auch nur zu vorsichtig beim Ausprobieren...

Schau Dir mal hier die Demo an, die ich nach dem von mir skizzierten Lösungsvorschlag erstellt habe.
Die dazu gehörende Projektdatei kannst Du Dir hier herunterladen.

Vielleicht kommst Du bei der Analyse der Probleme damit schneller zum Ziel.

Viel Erfolg

Ich kann bestätigen, dass Deine Lösung FUNKTIONIERT!!!

Meine nicht...

<script type="text/javascript">
function link2() {
top.location.href='./index.htm#xl_xr_page_ref';
}
</script>

<body OnLoad="link2()">

Dieser Link lädt bei mir - warum auch immer - die index.htm. Ganz so, als würde die Adresse hinter dem # gar nicht interpretiert.

Ich habe mal eine zusätzliche NavBar-Seite angelegt (navbar_test) ohne den Code im Body und mit einem direkten Link auf ./index.htm#xl_xr_page_ref. Und siehe da: auch dieser LInk lädt die index.htm. Testen lässt sich das recht einfach, wenn ich nach dem Exportieren die navbar_test.htm direkt starte.

Im Moment bin ich ein wenig ratlos...

Jetzt bin ich nicht mehr ratlos. Ich war einfach ein bisschen dumm... !

In der Navbar:

• Falsch ist: Öffnen der URL im übergeordneten Fenster (parent).
• Richtig ist: Öffnen der URL im gleichen Frame (self).

Und schon funktioniert es wunderbar! Nur Pkt. 2 meiner "Mängelliste" bleibt natürlich bestehen.

Eine Unschönheit habe ich in meiner Lösung noch entdeckt. Aus optischen Gründen soll das Menü exakt bis zum oberen Fensterrand reichen (siehe unten). Nach einem MouseOver bleibt ein Menüpunkt markiert, wenn ich nicht klicke, sondern die Maus elegant nach oben aus dem Fenster ziehe. Dann bekommt der Menüpunkt nicht mit, dass das MouseOver beendet ist. Das sieht nicht schön aus, da dann zwei Menüpunkte markiert sind. Hast Du da auch noch eine Idee?

Hier schon mal: herzlichen Dank für Deine Hartnäckigkeit und Geduld!

[...] wenn ich nicht klicke, sondern die Maus elegant nach oben aus dem Fenster ziehe. Dann bekommt der Menüpunkt nicht mit, dass das MouseOver beendet ist. [...]

Das kannst Du verhindern, wenn Du die Seitengröße der Seite vergrößerst, auf der die NavBar liegt. Dann wird   sicher erkannt, wenn der Mauszeiger die NavBar verlässt und die falsche Anzeige eines MouseOver Zustands vermieden.

Normalerweise ist die Erkennung der Zeigerposition ja kein Problem, weil alle Objekte sich innerhalb einer Seite befinden. Im vorliegenden Fall sind aber 2 unabhängige Seiten gleichzeitig sichtbar und der Wechsel von einem Objekt auf Seite A, zu einem Objekt auf Seite B ist bei der Programmierung nicht als Verlassen des aktivierten Objekts berücksichtigt worden...

Ich bin sicher, dass Du mit dem Lösungsvorschlag auch das letzte Problem aus der Welt schaffen kannst.

Viel Erfolg

Aus optischen Gründen soll das Menü exakt bis zum oberen Fensterrand reichen (siehe unten)....

Ich kann ich die Seite nicht vergrößern, denn ein Rand um die NavBar ist ja gerade nicht erwünscht.

ABER: das hat natürlich gar nichts mehr mit unserem ursprünglichen Thema "Seiteneffekt-Website" zu tun. Auch jede konventionelle Webseite hat dieses Problem, wenn die Navbar exakt bis zum oberen Seitenrand reicht.  MouseOverd wird nicht beendet, wenn die Maus direkt aus der NavBar oben aus dem Browser-Fenster ziehe.

Also können wir diesen Thread mit gutem Gewissen schließen.

Besten Dank,
Michael