angular-snapscroll
angular-snapscroll adds vertical scroll-and-snap functionality to angular.
- JS-only implementation
- Requires only angular core
- 5.7kB when minified, 2.1kB when gzipped
This is a suite of snapscroll examples that demonstrantes:
- full-page snapscroll (fit-window-height attribute)
- keyboard navigation (using enable-arrow-keys attribute)
- resetting current snap position after a manual scroll (try to scroll by dragging the scrollbar)
- snapIndex binding (the pagination showing on the right)
- binding snapIndex to window.location.hash (view source for this demo)
- touch support on touch devices (using angular-swipe module)
- nested snapscrolls
- before and after callbacks
- bigger-height children
- fit-window-height
Nested snapscrolls
Instances can be nested, side by side etc and won't interfere with each other. The first nested snapscroll below also demostrates how to keep vertical swipe gestures localized to a nested snapscroll instance.
Callbacks
Callbacks are passed a snapIndex parameter. In the beforeSnap callback, this is the index being snapped to while in the afterSnap callback, it's the index just snapped to.
Returning false in the beforeSnap callback disables snapping. In this example, it's impossible to snap to the last snap (unless by scrolling manually).
Note: callbacks are executed on the initial snap on page load and also after a manual scroll.