UIKit Web - Snippets: Unterschied zwischen den Versionen
Aus Wikizone
| Zeile 1: | Zeile 1: | ||
== Animationen mit Scrollspy in ProcessWire == | == Animationen mit Scrollspy in ProcessWire == | ||
| + | https://getuikit.com/docs/scrollspy | ||
| + | https://getuikit.com/docs/animation | ||
UIKit Animationen und der Scrollspy lassen sich gut kombinieren. Damit kannst du die Animationen auslösen wenn ein Element in den View kommt. | UIKit Animationen und der Scrollspy lassen sich gut kombinieren. Damit kannst du die Animationen auslösen wenn ein Element in den View kommt. | ||
Version vom 19. April 2024, 08:13 Uhr
Animationen mit Scrollspy in ProcessWire
https://getuikit.com/docs/scrollspy https://getuikit.com/docs/animation
UIKit Animationen und der Scrollspy lassen sich gut kombinieren. Damit kannst du die Animationen auslösen wenn ein Element in den View kommt.
Schritt 1: Festlegen, welche Animationen der Scrollspy auslösen soll. Das bietet sich in einem übergeordneten Container an.
<div id="bd" uk-scrollspy="target: div.ani; cls: uk-animation-slide-bottom-small; delay: 300">
- Target legt fest welche Elemente überwacht werden sollen
- cls legt fest welche Animation abgespielt wird.
Schritt 2: Im Editor Stile festlegen die man als Redakteur einfach verwenden kann.