![]() Available values are: offset ( integer) : Defines an offset from your target. Available values types are : node : a dom element string : you can type your own selector, or use values "top" and "bottom" to reach scroll boundaries int : An absolute scroll coordinate in pixels options (optional, object) : Settings object. Target: Defines where you want to scroll. Starts and stops at data-scroll-target position. A negative value will reverse the direction.Įlement's parallax direction. Top, bottom, left or rightWindow position of in-view trigger.Įlement parallax speed. Percent is relative to viewport height, otherwise it's absolute pixels.E.g. Splitting your page into sections may improve performance.Įlement in-view trigger offset : bottom,topFirst value is bottom offset, second (optional) is top offset. Required for basic styling.ĭefines a scrollable section. (Optional) Useful if you want to scope your element and get the progress of your element in the viewport for example.ĭefines the scroll container. Useful if you use transitions with native scrolling, otherwise we advise to set it to false if you don't want to break History API's scroll restoration feature. Sets history.scrollRestoration = 'manual' and calls window.scrollTo(0, 0) on locomotive-scroll init in Native Class. ![]() It can be useful if your page changes a lot between contexts and you want to reset everything. ![]() You can specify: smooth direction horizontalGestureFor tablet context you can also define breakpoint ( integer, defaults to 1024) to set the max-width breakpoint for tablets.Īllows to reload the page when switching between desktop, tablet and smartphone contexts. Object allowing to override some options for a particular context. With this option set to true, it listens on the whole document instead.ĭefines which gesture direction(s) scrolls in your instance. Multiply touch action to scroll faster than finger movement.īy default locomotive-scroll listens for scroll events only on the scroll container ( el option). If false, scrollbar will be appended to the body.įactor applied to the scroll delta, allowing to boost/reduce scrolling speed (regardless of the platform).īoost scrolling speed of Firefox on Windows. Specifies the container element for the scrollbar to be appended in. ![]() Float between 0 and 1.This defines the "smoothness" intensity. ,, Īn object defining the initial scroll coordinates on a smooth instance. Global in-view trigger offset : Use a string with % to use a percentage of the viewport height.Use a numeric value for absolute pixels unit.E.g. With methods Come here please.Ĭonst target = document.querySelector('#js-target') ĭata attribute prefix ( data-scroll-xxxx). Note: scroll-sections are optional but recommended to improve performance, particularly in long pages. Import LocomotiveScroll from 'locomotive-scroll' Įl: document.querySelector(''), Locomotive-scroll.css JS With a bundler import LocomotiveScroll from 'locomotive-scroll' ⚠️ Scroll-hijacking is a controversial practice that can cause usability, accessibility, and performance issues. Detection of elements in viewport & smooth scrolling with parallax effects. ![]()
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |