WebSite X5Help Center

 
Michael G.
Michael G.
User

Header fixieren  de

Auteur : Michael G.
Visité 2406, Followers 2, Partagé 0  

Hallo,

wie kann man den Header fixieren, so das der beim scrollen stehen bleibt?

Ich meine nicht die Stickybar

Posté le
11 RéPONSES - 3 UTILE
Martin H.
Martin H.
User

Mit der 16er Version ging es noch mit diesem Code:

<style> #imHeader {position: fixed; z-index: 1000;} </style>

Unter: "Sitemap" -> "Eigenschaften" -> "Erweiter" -> "Vor dem </Head> Tag"

Unter "Vorlage" -> "Struktuer der Vorlage" -> "Header auf die Breite des Browserfensters erweitern" anklicken.

Lire plus
Posté le de Martin H.
Thomas M.
Thomas M.
User

Habe diesen Code auch eingefügt! Hat bis zum vorletzten Update gut funktioniert! Jetzt ist es so dass der Header zwar fixiert bleibt, aber nicht über die Breite des Browserfenster geht, sondern nur bis zum Breakpoint  und nicht weiter!

Also bei responsiver Einstellung  "1450 und weiter" geht der Header nur bis 1450.Bei Smartphone "kleiner als 480" nur bis 320!

Wenn ich denn Code rausnehme, funktioniert es!

Gibts vielleicht eine Lösung dazu?

Lire plus
Posté le de Thomas M.
Thomas M.
Thomas M.
User
Thomas M.
Habe diesen Code auch eingefügt! Hat bis zum vorletzten Update gut funktioniert! Jetzt ist es so dass der Header zwar fixiert bleibt, aber nicht über die Breite des Browserfenster geht, sondern nur bis zum Breakpoint  und nicht weiter! Also bei responsiver Einstellung  "1450 und weiter" geht der Header nur bis 1450.Bei Smartphone "kleiner als 480" nur bis 320! Wenn ich denn Code rausnehme, funktioniert die Breite ! Aber logischerweise nicht fixiert! Gibts vielleicht eine Lösung dazu?
Lire plus
Posté le de Thomas M.
Thomas M.
Thomas M.
User

Entschuldigung, doppelt! Wie kann man den seinen Beitrag nachträglich bearbeiten?

Lire plus
Posté le de Thomas M.
JJ. JUAG
JJ. JUAG
User

Sie könnten anstelle des Headers die Stickybar verwenden und so immer den Kopf oben sichtbar haben. Header leeren alle responsiven auch, Header im Tempate leeren und nur als Hintergrund für Stickybar stehen lassen (Höhe für beide gleich, damit der Inhalt nicht dahinter steht, wenn scroll ganz oben.

JJ.

Lire plus
Posté le de JJ. JUAG
Thomas M.
Thomas M.
User

Nein, das funktioniert nicht, da die Stickybar erst erscheint, wenn man etwas runtergescollt hat.

Also wäre in der Erstansicht kein Header sichtbar?

Lire plus
Posté le de Thomas M.
Martin H.
Martin H.
User

Ich habe den Code abgeändert, jetzt funktionert er auch unter der Version 17:

<style>#imHeader {position: fixed; z-index: 1000; width: 100%}</style>

Den Code unter: "Sitemap" -> "Eigenschaften" -> "Erweiter" -> "Vor dem </Head> Tag" eingeben.

Unter "Vorlage" -> "Struktur der Vorlage" -> "Header" die passende Farbe bzw. Grafik einstellen.

Lire plus
Posté le de Martin H.
JJ. JUAG
JJ. JUAG
User

Sorry, habe wohl zu schnell getestet (ohne Test, wie geht es mit Header null Höhe? und soviel Abstand wie Stickybar gross ist beim Inhalt oben), ansonsten gilt parallel zum Header mit genau dem gleichen Inhalt und der gleichen grösse (die Objekte können ja kopiert und positioniert werden) in der Stickybar. So ist es wohl von den Programmierern auch vorgesehen.

Eventuell wäre auch eine Anregung sinnvoll, die Stickybar mit einer Auswahl "immer sichtbar" zu versehen!

Es ist ja immer damit zu rechnen, das der nächste Upgrade den eigenen Code nicht mehr verarbeitet, darum suche ich Lösungen mit den vorhandenen Möglichkeiten!

JJ.

Lire plus
Posté le de JJ. JUAG
Martin H.
Martin H.
User

@Juag

Mach einen neuen Post auf und mach das mit der immer Sichtbaren Sitckybar oder Header als Idee. Bin gespannt ob und wann Inco dies umsetzt laughing

Solange werde ich es mit einem individuellen Code machen.

Lire plus
Posté le de Martin H.
Thomas M.
Thomas M.
User

@Marin H.Vielen Dank für den geänderten Code! Funktioniert einwandfrei!!

@Juag: Trotzdem danke fürs Testen!

Lire plus
Posté le de Thomas M.
René W.
René W.
User

Erstellt mit: WebSite X5 Professional, Version 17.0.8

Ich wollte kürzlich ebenfalls den Header fixieren, erfolglos. Auch obige Codes hatten den gewünschten Erfolg nicht gebracht.

Im Moment bin ich daran alle meine Webseiten auf den aktuellen Stand zu bringen.
Heute bin ich erstaunt gewesen, denn eine Seite macht genau das was ich wollte.

Und dies aus nicht erfindlichen, nicht nachvollziehbaren Gründen.
Link:
https://Lama.watelet.ch/

Fotos: Seite nach unten scrollen.

Lire plus
Posté le de René W.