Header fixieren 
Autor: Michael G.
Besucht 2130,
Followers 2,
Geteilt 0
Hallo,
wie kann man den Header fixieren, so das der beim scrollen stehen bleibt?
Ich meine nicht die Stickybar
Gepostet am
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.
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?
Entschuldigung, doppelt! Wie kann man den seinen Beitrag nachträglich bearbeiten?
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.
Nein, das funktioniert nicht, da die Stickybar erst erscheint, wenn man etwas runtergescollt hat.
Also wäre in der Erstansicht kein Header sichtbar?
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.
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.
@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
Solange werde ich es mit einem individuellen Code machen.
@Marin H.Vielen Dank für den geänderten Code! Funktioniert einwandfrei!!
@Juag: Trotzdem danke fürs Testen!
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.