Sticky-Top zum Fixieren eines Blocks
Verfasst: Do 17. Apr 2025, 04:43
Es besteht häufig der Wunsch, einen Header (Kopfblock) zu fixieren, sodass der nachfolgende Inhalt über diesen fixierten Block nach oben scrollt.
Es gibt verschiedene Möglichkeiten, dies zu erreichen, jedoch funktionieren nicht alle Methoden auf iOS-Geräten wie dem iPhone.
Die einfache Bootstrap-Klasse class="sticky-top" scheint jedoch mittlerweile auch auf dem iPhone zu funktionieren. Ich habe dies gestern auf dem aktuellen `iPhone 16 Pro` getestet, und es lässt sich sehr einfach anwenden.
https://www.mobirise-tutorials.com/Tuto ... y-Top.html
Selbstverständlich kann jeder Block mit dieser Klasse versehen werden. Je nachdem, welchen z-index (0 oder 1) man dem Block zuweist, wird er entweder vom restlichen Inhalt beim Scrollen überlagert (0) oder oben fixiert (1).
Es gibt verschiedene Möglichkeiten, dies zu erreichen, jedoch funktionieren nicht alle Methoden auf iOS-Geräten wie dem iPhone.
Die einfache Bootstrap-Klasse class="sticky-top" scheint jedoch mittlerweile auch auf dem iPhone zu funktionieren. Ich habe dies gestern auf dem aktuellen `iPhone 16 Pro` getestet, und es lässt sich sehr einfach anwenden.
https://www.mobirise-tutorials.com/Tuto ... y-Top.html
Selbstverständlich kann jeder Block mit dieser Klasse versehen werden. Je nachdem, welchen z-index (0 oder 1) man dem Block zuweist, wird er entweder vom restlichen Inhalt beim Scrollen überlagert (0) oder oben fixiert (1).