scrollClasses
@blackbyte.sugar.js.dom.feature
This feature allows you to have -scrolled, -scrolled-x, -scrolled-y, -scrolled-up and -scrolled-down classes added and removed from
the body depending on an scroll offset that can be set by:
-scrolled: Added when passed theoffsetset in the settings-scrolled-x: Added when passed theoffsetXset in the settings-scrolled-y: Added when passed theoffsetYset in the settings-scrolled-up: Added when the user scrolls up (no offset)-scrolled-down: Added when the user scrolls down (no offset)
Note that you can specify these settings in the CSS with the following variables:
--s-scrolled-classes-offset: The offset you want before adding the classes--s-scrolled-classes-offset-x: The offset x you want before adding the classes--s-scrolled-classes-offset-y: The offset y you want before adding the classes--s-scrolled-classes-class: The class name you want. Will be used also in the %cls-x and %cls-y classes
Params
- settings{}TScrollClassesSettings
The settings you want to override
Example
import { scrollClasses } from '@blackbyte/sugar/features';
scrollClasses({
class: 'hello',
offset: 200
});Settings
- offset100number
The offset you want before adding the classes
- offsetX-number
The offset x you want before adding the classes
- offsetY-number
The offset y you want before adding the classes
- classscrolledstring
The class name you want. Will be used also in the %cls-x and %cls-y classes