diff --git a/README.md b/README.md index 25b02ad..182d604 100755 --- a/README.md +++ b/README.md @@ -72,13 +72,16 @@ AOS.init(); // You can also pass an optional settings object // below listed default settings AOS.init({ - // Global settings + // Global settings: disable: false, // accepts following values: 'phone', 'tablet', 'mobile', boolean, expression or function startEvent: 'DOMContentLoaded', // name of the event dispatched on the document, that AOS should initialize on initClassName: 'aos-init', // class applied after initialization animatedClassName: 'aos-animate', // class applied on animation useClassNames: false, // if true, will add content of `data-aos` as classes on scroll disableMutationObserver: false, // disables automatic mutations' detections (advanced) + debounceDelay: 50, // the delay on debounce used while resizing window (advanced) + throttleDelay: 99, // the delay on throttle used while scrolling the page (advanced) + // Settings that can be overridden on per-element basis, by `data-aos-*` attributes: offset: 120, // offset (in px) from the original trigger point @@ -88,6 +91,7 @@ AOS.init({ once: false, // whether animation should happen only once - while scrolling down mirror: false, // whether elements should animate out while scrolling past them anchorPlacement: 'top-bottom', // defines which position of the element regarding to window should trigger the animation + }); ``` diff --git a/src/js/aos.js b/src/js/aos.js index ddcd9f2..890af7a 100644 --- a/src/js/aos.js +++ b/src/js/aos.js @@ -39,7 +39,9 @@ let options = { animatedClassName: 'aos-animate', initClassName: 'aos-init', useClassNames: false, - disableMutationObserver: false + disableMutationObserver: false, + throttleDelay: 99, + debounceDelay: 50 }; // Detect not supported browsers (<=IE9) @@ -59,7 +61,7 @@ const initializeScroll = function initializeScroll() { 'scroll', throttle(() => { handleScroll($aosElements, options.once); - }, 99) + }, options.throttleDelay) ); return $aosElements; @@ -193,8 +195,15 @@ const init = function init(settings) { /** * Refresh plugin on window resize or orientation change */ - window.addEventListener('resize', debounce(refresh, 50, true)); - window.addEventListener('orientationchange', debounce(refresh, 50, true)); + window.addEventListener( + 'resize', + debounce(refresh, options.debounceDelay, true) + ); + + window.addEventListener( + 'orientationchange', + debounce(refresh, options.debounceDelay, true) + ); return $aosElements; };