Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
scrollama - npm Package Compare versions
Comparing version 3.1.0 to 3.1.1
@@ -116,4 +116,4 @@ (function (global, factory) { | ||
| let currentScrollY = 0; | ||
| let comparisonScrollY = 0; | ||
| let currentScrollY; | ||
| let comparisonScrollY; | ||
| let direction; | ||
@@ -131,4 +131,6 @@ | ||
| function setupScroll() { | ||
| document.addEventListener("scroll", onScroll); | ||
| function setupScroll(container) { | ||
| currentScrollY = 0; | ||
| comparisonScrollY = 0; | ||
| document.addEventListener("scroll", () => onScroll(container)); | ||
| } | ||
@@ -317,4 +319,2 @@ | ||
| /* SETUP */ | ||
| setupScroll(); | ||
| const S = {}; | ||
@@ -332,2 +332,5 @@ | ||
| }) => { | ||
| setupScroll(container); | ||
| steps = selectAll(step, parent).map((node, index) => ({ | ||
@@ -334,0 +337,0 @@ index, |
@@ -1,1 +0,1 @@ | ||
| !function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):(e=e||self).scrollama=t()}(this,function(){"use strict";function S({id:e,step:t,marginTop:n}){var{index:o,height:t}=t,o=`scrollama__debug-step--${e}-${o}`;let r=document.querySelector(`.${o}`);r=r||function(e){const t=document.createElement("div");t.className=`scrollama__debug-step ${e}`,t.style.position="fixed",t.style.left="0",t.style.width="100%",t.style.zIndex="9999",t.style.borderTop="2px solid black",t.style.borderBottom="2px solid black";const n=document.createElement("p");return n.style.position="absolute",n.style.left="0",n.style.height="1px",n.style.width="100%",n.style.borderTop="1px dashed black",t.appendChild(n),document.body.appendChild(t),t}(o),r.style.top=`${-1*n}px`,r.style.height=`${t}px`,r.querySelector("p").style.top=`${t/2}px`}function k(e){console.error(`scrollama error: ${e}`)}function M(e){return+e.getAttribute("data-scrollama-index")}function q(e){if("string"==typeof e&&0<e.indexOf("px")){var t=+e.replace("px","");return isNaN(t)?(err("offset value must be in 'px' format. Fallback to 0.5."),{format:"percent",value:.5}):{format:"pixels",value:t}}return"number"!=typeof e&&isNaN(+e)?null:(1<e&&err("offset value is greater than 1. Fallback to 1."),e<0&&err("offset value is lower than 0. Fallback to 0."),{format:"percent",value:Math.min(Math.max(0,e),1)})}let t=0,n=0,O;function A(e){e=e?e.scrollTop:window.pageYOffset;t!==e&&(t=e,t>n?O="down":t<n&&(O="up"),n=t)}return function(){let r={},s=function(){var t="abcdefghijklmnopqrstuvwxyz",e=Date.now();const n=[];for(let e=0;e<6;e+=1){var o=t[Math.floor(Math.random()*t.length)];n.push(o)}return`${n.join("")}${e}`}(),c=[],f,l,p=0,t=!1,u=!1,d=!1,h=!1,o=[];function g(){r={stepEnter:()=>{},stepExit:()=>{},stepProgress:()=>{}},o=[]}function m(e){e&&!t&&w(),!e&&t&&b(),t=e}function i(e,t){var n=M(e);const o=c[n];void 0!==t&&(o.progress=t);t={element:e,index:n,progress:t,direction:O};"enter"===o.state&&r.stepProgress(t)}function n([e]){var t=M(e.target);const n=c[t];e=e.target.offsetHeight;e!==n.height&&(n.height=e,v(n),E(n),y(n))}function a([e]){A(l);var{isIntersecting:t,target:e}=e;(t?function(e){var t=M(e);const n=c[t];e={element:e,index:t,direction:O},n.direction=O,n.state="enter",o[t]||r.stepEnter(e),h&&(o[t]=!0)}:function(e){var t=M(e);const n=c[t];n.state&&(t={element:e,index:t,direction:O},u&&("down"===O&&n.progress<1?i(e,1):"up"===O&&0<n.progress&&i(e,0)),n.direction=O,n.state="exit",r.stepExit(t))})(e)}function x([e]){var t=M(e.target),n=c[t],{isIntersecting:o,intersectionRatio:t,target:e}=e;o&&"enter"===n.state&&i(e,t)}function v({observers:t}){Object.keys(t).map(e=>{t[e].disconnect()})}function b(){c.forEach(v)}function y(e){const t=new ResizeObserver(n);t.observe(e.node),e.observers.resize=t}function E(e){var t=window.innerHeight,n=e.offset||f,o="pixels"===n.format?1:t,n=n.value*o,o=e.height/2-n,n=e.height/2-(t-n);const r=new IntersectionObserver(a,{rootMargin:`${o}px 0px ${n}px 0px`,threshold:.5});r.observe(e.node),e.observers.step=r,d&&S({id:s,step:e,marginTop:o,marginBottom:n})}function e(e){var t=window.innerHeight,n=e.offset||f,o="pixels"===n.format?1:t,o=n.value*o,o=`${-o+e.height}px 0px ${o-t}px 0px`,t=function(e,t){var n=Math.ceil(e/t);const o=[];var r=1/n;for(let e=0;e<n+1;e+=1)o.push(e*r);return o}(e.height,p);const r=new IntersectionObserver(x,{rootMargin:o,threshold:t});r.observe(e.node),e.observers.progress=r}function w(){b(),c.forEach(y),c.forEach(E),u&&c.forEach(e)}document.addEventListener("scroll",A);const $={};return $.setup=({step:e,parent:t,offset:n=.5,threshold:o=4,progress:r=!1,once:s=!1,debug:i=!1,container:a=void 0})=>{return c=([e,t=document]=[e,t],("string"==typeof e?Array.from(t.querySelectorAll(e)):e instanceof Element?[e]:e instanceof NodeList?Array.from(e):e instanceof Array?e:[]).map((e,t)=>({index:t,direction:void 0,height:e.offsetHeight,node:e,observers:{},offset:q(e.dataset.offset),top:function(e){var{top:e}=e.getBoundingClientRect();return e+window.pageYOffset-(document.body.clientTop||0)}(e),progress:0,state:void 0}))),c.length?(u=r,h=s,d=i,p=Math.max(1,+o),f=q(n),l=a,g(),c.forEach(e=>e.node.setAttribute("data-scrollama-index",e.index)),m(!0)):k("no step elements"),$},$.enable=()=>(m(!0),$),$.disable=()=>(m(!1),$),$.destroy=()=>(m(!1),g(),$),$.resize=()=>(w(),$),$.offset=e=>null==e?f.value:(f=q(e),w(),$),$.onStepEnter=e=>("function"==typeof e?r.stepEnter=e:k("onStepEnter requires a function"),$),$.onStepExit=e=>("function"==typeof e?r.stepExit=e:k("onStepExit requires a function"),$),$.onStepProgress=e=>("function"==typeof e?r.stepProgress=e:k("onStepProgress requires a function"),$),$}}); | ||
| !function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):(e=e||self).scrollama=t()}(this,function(){"use strict";function S({id:e,step:t,marginTop:n}){var{index:o,height:t}=t,o=`scrollama__debug-step--${e}-${o}`;let r=document.querySelector(`.${o}`);r=r||function(e){const t=document.createElement("div");t.className=`scrollama__debug-step ${e}`,t.style.position="fixed",t.style.left="0",t.style.width="100%",t.style.zIndex="9999",t.style.borderTop="2px solid black",t.style.borderBottom="2px solid black";const n=document.createElement("p");return n.style.position="absolute",n.style.left="0",n.style.height="1px",n.style.width="100%",n.style.borderTop="1px dashed black",t.appendChild(n),document.body.appendChild(t),t}(o),r.style.top=`${-1*n}px`,r.style.height=`${t}px`,r.querySelector("p").style.top=`${t/2}px`}function k(e){console.error(`scrollama error: ${e}`)}function M(e){return+e.getAttribute("data-scrollama-index")}function q(e){if("string"==typeof e&&0<e.indexOf("px")){var t=+e.replace("px","");return isNaN(t)?(err("offset value must be in 'px' format. Fallback to 0.5."),{format:"percent",value:.5}):{format:"pixels",value:t}}return"number"!=typeof e&&isNaN(+e)?null:(1<e&&err("offset value is greater than 1. Fallback to 1."),e<0&&err("offset value is lower than 0. Fallback to 0."),{format:"percent",value:Math.min(Math.max(0,e),1)})}let O,A,N;function T(e){e=e?e.scrollTop:window.pageYOffset;O!==e&&(O=e,O>A?N="down":O<A&&(N="up"),A=O)}return function(){let r={},s=function(){var t="abcdefghijklmnopqrstuvwxyz",e=Date.now();const n=[];for(let e=0;e<6;e+=1){var o=t[Math.floor(Math.random()*t.length)];n.push(o)}return`${n.join("")}${e}`}(),f=[],l,p,u=0,t=!1,d=!1,h=!1,g=!1,o=[];function m(){r={stepEnter:()=>{},stepExit:()=>{},stepProgress:()=>{}},o=[]}function v(e){e&&!t&&w(),!e&&t&&b(),t=e}function i(e,t){var n=M(e);const o=f[n];void 0!==t&&(o.progress=t);t={element:e,index:n,progress:t,direction:N};"enter"===o.state&&r.stepProgress(t)}function n([e]){var t=M(e.target);const n=f[t];e=e.target.offsetHeight;e!==n.height&&(n.height=e,x(n),E(n),y(n))}function a([e]){T(p);var{isIntersecting:t,target:e}=e;(t?function(e){var t=M(e);const n=f[t];e={element:e,index:t,direction:N},n.direction=N,n.state="enter",o[t]||r.stepEnter(e),g&&(o[t]=!0)}:function(e){var t=M(e);const n=f[t];n.state&&(t={element:e,index:t,direction:N},d&&("down"===N&&n.progress<1?i(e,1):"up"===N&&0<n.progress&&i(e,0)),n.direction=N,n.state="exit",r.stepExit(t))})(e)}function c([e]){var t=M(e.target),n=f[t],{isIntersecting:o,intersectionRatio:t,target:e}=e;o&&"enter"===n.state&&i(e,t)}function x({observers:t}){Object.keys(t).map(e=>{t[e].disconnect()})}function b(){f.forEach(x)}function y(e){const t=new ResizeObserver(n);t.observe(e.node),e.observers.resize=t}function E(e){var t=window.innerHeight,n=e.offset||l,o="pixels"===n.format?1:t,n=n.value*o,o=e.height/2-n,n=e.height/2-(t-n);const r=new IntersectionObserver(a,{rootMargin:`${o}px 0px ${n}px 0px`,threshold:.5});r.observe(e.node),e.observers.step=r,h&&S({id:s,step:e,marginTop:o,marginBottom:n})}function e(e){var t=window.innerHeight,n=e.offset||l,o="pixels"===n.format?1:t,o=n.value*o,o=`${-o+e.height}px 0px ${o-t}px 0px`,t=function(e,t){var n=Math.ceil(e/t);const o=[];var r=1/n;for(let e=0;e<n+1;e+=1)o.push(e*r);return o}(e.height,u);const r=new IntersectionObserver(c,{rootMargin:o,threshold:t});r.observe(e.node),e.observers.progress=r}function w(){b(),f.forEach(y),f.forEach(E),d&&f.forEach(e)}const $={};return $.setup=({step:e,parent:t,offset:n=.5,threshold:o=4,progress:r=!1,once:s=!1,debug:i=!1,container:a=void 0})=>{var c;return c=a,O=0,A=0,document.addEventListener("scroll",()=>T(c)),f=([e,t=document]=[e,t],("string"==typeof e?Array.from(t.querySelectorAll(e)):e instanceof Element?[e]:e instanceof NodeList?Array.from(e):e instanceof Array?e:[]).map((e,t)=>({index:t,direction:void 0,height:e.offsetHeight,node:e,observers:{},offset:q(e.dataset.offset),top:function(e){var{top:e}=e.getBoundingClientRect();return e+window.pageYOffset-(document.body.clientTop||0)}(e),progress:0,state:void 0}))),f.length?(d=r,g=s,h=i,u=Math.max(1,+o),l=q(n),p=a,m(),f.forEach(e=>e.node.setAttribute("data-scrollama-index",e.index)),v(!0)):k("no step elements"),$},$.enable=()=>(v(!0),$),$.disable=()=>(v(!1),$),$.destroy=()=>(v(!1),m(),$),$.resize=()=>(w(),$),$.offset=e=>null==e?l.value:(l=q(e),w(),$),$.onStepEnter=e=>("function"==typeof e?r.stepEnter=e:k("onStepEnter requires a function"),$),$.onStepExit=e=>("function"==typeof e?r.stepExit=e:k("onStepExit requires a function"),$),$.onStepProgress=e=>("function"==typeof e?r.stepProgress=e:k("onStepProgress requires a function"),$),$}}); |
@@ -1,1 +0,1 @@ | ||
| !function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):(e=e||self).scrollama=t()}(this,function(){"use strict";function S({id:e,step:t,marginTop:n}){var{index:o,height:t}=t,o=`scrollama__debug-step--${e}-${o}`;let r=document.querySelector(`.${o}`);r=r||function(e){const t=document.createElement("div");t.className=`scrollama__debug-step ${e}`,t.style.position="fixed",t.style.left="0",t.style.width="100%",t.style.zIndex="9999",t.style.borderTop="2px solid black",t.style.borderBottom="2px solid black";const n=document.createElement("p");return n.style.position="absolute",n.style.left="0",n.style.height="1px",n.style.width="100%",n.style.borderTop="1px dashed black",t.appendChild(n),document.body.appendChild(t),t}(o),r.style.top=`${-1*n}px`,r.style.height=`${t}px`,r.querySelector("p").style.top=`${t/2}px`}function k(e){console.error(`scrollama error: ${e}`)}function M(e){return+e.getAttribute("data-scrollama-index")}function q(e){if("string"==typeof e&&0<e.indexOf("px")){var t=+e.replace("px","");return isNaN(t)?(err("offset value must be in 'px' format. Fallback to 0.5."),{format:"percent",value:.5}):{format:"pixels",value:t}}return"number"!=typeof e&&isNaN(+e)?null:(1<e&&err("offset value is greater than 1. Fallback to 1."),e<0&&err("offset value is lower than 0. Fallback to 0."),{format:"percent",value:Math.min(Math.max(0,e),1)})}let t=0,n=0,O;function A(e){e=e?e.scrollTop:window.pageYOffset;t!==e&&(t=e,t>n?O="down":t<n&&(O="up"),n=t)}return function(){let r={},s=function(){var t="abcdefghijklmnopqrstuvwxyz",e=Date.now();const n=[];for(let e=0;e<6;e+=1){var o=t[Math.floor(Math.random()*t.length)];n.push(o)}return`${n.join("")}${e}`}(),c=[],f,l,p=0,t=!1,u=!1,d=!1,h=!1,o=[];function g(){r={stepEnter:()=>{},stepExit:()=>{},stepProgress:()=>{}},o=[]}function m(e){e&&!t&&w(),!e&&t&&b(),t=e}function i(e,t){var n=M(e);const o=c[n];void 0!==t&&(o.progress=t);t={element:e,index:n,progress:t,direction:O};"enter"===o.state&&r.stepProgress(t)}function n([e]){var t=M(e.target);const n=c[t];e=e.target.offsetHeight;e!==n.height&&(n.height=e,v(n),E(n),y(n))}function a([e]){A(l);var{isIntersecting:t,target:e}=e;(t?function(e){var t=M(e);const n=c[t];e={element:e,index:t,direction:O},n.direction=O,n.state="enter",o[t]||r.stepEnter(e),h&&(o[t]=!0)}:function(e){var t=M(e);const n=c[t];n.state&&(t={element:e,index:t,direction:O},u&&("down"===O&&n.progress<1?i(e,1):"up"===O&&0<n.progress&&i(e,0)),n.direction=O,n.state="exit",r.stepExit(t))})(e)}function x([e]){var t=M(e.target),n=c[t],{isIntersecting:o,intersectionRatio:t,target:e}=e;o&&"enter"===n.state&&i(e,t)}function v({observers:t}){Object.keys(t).map(e=>{t[e].disconnect()})}function b(){c.forEach(v)}function y(e){const t=new ResizeObserver(n);t.observe(e.node),e.observers.resize=t}function E(e){var t=window.innerHeight,n=e.offset||f,o="pixels"===n.format?1:t,n=n.value*o,o=e.height/2-n,n=e.height/2-(t-n);const r=new IntersectionObserver(a,{rootMargin:`${o}px 0px ${n}px 0px`,threshold:.5});r.observe(e.node),e.observers.step=r,d&&S({id:s,step:e,marginTop:o,marginBottom:n})}function e(e){var t=window.innerHeight,n=e.offset||f,o="pixels"===n.format?1:t,o=n.value*o,o=`${-o+e.height}px 0px ${o-t}px 0px`,t=function(e,t){var n=Math.ceil(e/t);const o=[];var r=1/n;for(let e=0;e<n+1;e+=1)o.push(e*r);return o}(e.height,p);const r=new IntersectionObserver(x,{rootMargin:o,threshold:t});r.observe(e.node),e.observers.progress=r}function w(){b(),c.forEach(y),c.forEach(E),u&&c.forEach(e)}document.addEventListener("scroll",A);const $={};return $.setup=({step:e,parent:t,offset:n=.5,threshold:o=4,progress:r=!1,once:s=!1,debug:i=!1,container:a=void 0})=>{return c=([e,t=document]=[e,t],("string"==typeof e?Array.from(t.querySelectorAll(e)):e instanceof Element?[e]:e instanceof NodeList?Array.from(e):e instanceof Array?e:[]).map((e,t)=>({index:t,direction:void 0,height:e.offsetHeight,node:e,observers:{},offset:q(e.dataset.offset),top:function(e){var{top:e}=e.getBoundingClientRect();return e+window.pageYOffset-(document.body.clientTop||0)}(e),progress:0,state:void 0}))),c.length?(u=r,h=s,d=i,p=Math.max(1,+o),f=q(n),l=a,g(),c.forEach(e=>e.node.setAttribute("data-scrollama-index",e.index)),m(!0)):k("no step elements"),$},$.enable=()=>(m(!0),$),$.disable=()=>(m(!1),$),$.destroy=()=>(m(!1),g(),$),$.resize=()=>(w(),$),$.offset=e=>null==e?f.value:(f=q(e),w(),$),$.onStepEnter=e=>("function"==typeof e?r.stepEnter=e:k("onStepEnter requires a function"),$),$.onStepExit=e=>("function"==typeof e?r.stepExit=e:k("onStepExit requires a function"),$),$.onStepProgress=e=>("function"==typeof e?r.stepProgress=e:k("onStepProgress requires a function"),$),$}}); | ||
| !function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):(e=e||self).scrollama=t()}(this,function(){"use strict";function S({id:e,step:t,marginTop:n}){var{index:o,height:t}=t,o=`scrollama__debug-step--${e}-${o}`;let r=document.querySelector(`.${o}`);r=r||function(e){const t=document.createElement("div");t.className=`scrollama__debug-step ${e}`,t.style.position="fixed",t.style.left="0",t.style.width="100%",t.style.zIndex="9999",t.style.borderTop="2px solid black",t.style.borderBottom="2px solid black";const n=document.createElement("p");return n.style.position="absolute",n.style.left="0",n.style.height="1px",n.style.width="100%",n.style.borderTop="1px dashed black",t.appendChild(n),document.body.appendChild(t),t}(o),r.style.top=`${-1*n}px`,r.style.height=`${t}px`,r.querySelector("p").style.top=`${t/2}px`}function k(e){console.error(`scrollama error: ${e}`)}function M(e){return+e.getAttribute("data-scrollama-index")}function q(e){if("string"==typeof e&&0<e.indexOf("px")){var t=+e.replace("px","");return isNaN(t)?(err("offset value must be in 'px' format. Fallback to 0.5."),{format:"percent",value:.5}):{format:"pixels",value:t}}return"number"!=typeof e&&isNaN(+e)?null:(1<e&&err("offset value is greater than 1. Fallback to 1."),e<0&&err("offset value is lower than 0. Fallback to 0."),{format:"percent",value:Math.min(Math.max(0,e),1)})}let O,A,N;function T(e){e=e?e.scrollTop:window.pageYOffset;O!==e&&(O=e,O>A?N="down":O<A&&(N="up"),A=O)}return function(){let r={},s=function(){var t="abcdefghijklmnopqrstuvwxyz",e=Date.now();const n=[];for(let e=0;e<6;e+=1){var o=t[Math.floor(Math.random()*t.length)];n.push(o)}return`${n.join("")}${e}`}(),f=[],l,p,u=0,t=!1,d=!1,h=!1,g=!1,o=[];function m(){r={stepEnter:()=>{},stepExit:()=>{},stepProgress:()=>{}},o=[]}function v(e){e&&!t&&w(),!e&&t&&b(),t=e}function i(e,t){var n=M(e);const o=f[n];void 0!==t&&(o.progress=t);t={element:e,index:n,progress:t,direction:N};"enter"===o.state&&r.stepProgress(t)}function n([e]){var t=M(e.target);const n=f[t];e=e.target.offsetHeight;e!==n.height&&(n.height=e,x(n),E(n),y(n))}function a([e]){T(p);var{isIntersecting:t,target:e}=e;(t?function(e){var t=M(e);const n=f[t];e={element:e,index:t,direction:N},n.direction=N,n.state="enter",o[t]||r.stepEnter(e),g&&(o[t]=!0)}:function(e){var t=M(e);const n=f[t];n.state&&(t={element:e,index:t,direction:N},d&&("down"===N&&n.progress<1?i(e,1):"up"===N&&0<n.progress&&i(e,0)),n.direction=N,n.state="exit",r.stepExit(t))})(e)}function c([e]){var t=M(e.target),n=f[t],{isIntersecting:o,intersectionRatio:t,target:e}=e;o&&"enter"===n.state&&i(e,t)}function x({observers:t}){Object.keys(t).map(e=>{t[e].disconnect()})}function b(){f.forEach(x)}function y(e){const t=new ResizeObserver(n);t.observe(e.node),e.observers.resize=t}function E(e){var t=window.innerHeight,n=e.offset||l,o="pixels"===n.format?1:t,n=n.value*o,o=e.height/2-n,n=e.height/2-(t-n);const r=new IntersectionObserver(a,{rootMargin:`${o}px 0px ${n}px 0px`,threshold:.5});r.observe(e.node),e.observers.step=r,h&&S({id:s,step:e,marginTop:o,marginBottom:n})}function e(e){var t=window.innerHeight,n=e.offset||l,o="pixels"===n.format?1:t,o=n.value*o,o=`${-o+e.height}px 0px ${o-t}px 0px`,t=function(e,t){var n=Math.ceil(e/t);const o=[];var r=1/n;for(let e=0;e<n+1;e+=1)o.push(e*r);return o}(e.height,u);const r=new IntersectionObserver(c,{rootMargin:o,threshold:t});r.observe(e.node),e.observers.progress=r}function w(){b(),f.forEach(y),f.forEach(E),d&&f.forEach(e)}const $={};return $.setup=({step:e,parent:t,offset:n=.5,threshold:o=4,progress:r=!1,once:s=!1,debug:i=!1,container:a=void 0})=>{var c;return c=a,O=0,A=0,document.addEventListener("scroll",()=>T(c)),f=([e,t=document]=[e,t],("string"==typeof e?Array.from(t.querySelectorAll(e)):e instanceof Element?[e]:e instanceof NodeList?Array.from(e):e instanceof Array?e:[]).map((e,t)=>({index:t,direction:void 0,height:e.offsetHeight,node:e,observers:{},offset:q(e.dataset.offset),top:function(e){var{top:e}=e.getBoundingClientRect();return e+window.pageYOffset-(document.body.clientTop||0)}(e),progress:0,state:void 0}))),f.length?(d=r,g=s,h=i,u=Math.max(1,+o),l=q(n),p=a,m(),f.forEach(e=>e.node.setAttribute("data-scrollama-index",e.index)),v(!0)):k("no step elements"),$},$.enable=()=>(v(!0),$),$.disable=()=>(v(!1),$),$.destroy=()=>(v(!1),m(),$),$.resize=()=>(w(),$),$.offset=e=>null==e?l.value:(l=q(e),w(),$),$.onStepEnter=e=>("function"==typeof e?r.stepEnter=e:k("onStepEnter requires a function"),$),$.onStepExit=e=>("function"==typeof e?r.stepExit=e:k("onStepExit requires a function"),$),$.onStepProgress=e=>("function"==typeof e?r.stepProgress=e:k("onStepProgress requires a function"),$),$}}); |
| { | ||
| "name": "scrollama", | ||
| "version": "3.1.0", | ||
| "version": "3.1.1", | ||
| "description": "Lightweight scrollytelling library using IntersectionObserver", | ||
@@ -5,0 +5,0 @@ "main": "build/scrollama.js", |
@@ -118,13 +118,12 @@ <img src="https://russellgoldenberg.github.io/scrollama/logo.png" width="160" alt="scrollama.js"/> | ||
| - `step` (string | HTMLElement[]): Selector (or array of elements) for the step elements that will trigger changes. | ||
| **required** | ||
| - `offset` (number 0 - 1, or string with "px"): How far from the top of the viewport to trigger a step. **(default: 0.5) (middle of screen)** | ||
| - `progress` (boolean): Whether to fire incremental step progress updates or | ||
| not. **(default: false)** | ||
| - `threshold` (number, 1+): The granularity of the progress interval in pixels (smaller = more granular). **(default: 4)** | ||
| - `once` (boolean): Only trigger the step to enter once then remove listener. **(default: false)** | ||
| - `debug` (boolean): Whether to show visual debugging tools or not. **(default: | ||
| false)** | ||
| - parent (HTMLElement[]): Parent element for step selector (use if you steps are in shadow DOM). **(default: undefined)** | ||
| - container(HTMLElement): Parent element for the scroll story (use if scrollama is nested in a HTML element with overflow set to scoll or auto). **(default: window)** | ||
| | Option | Type | Description | Default | | ||
| | --- | --- | --- | --- | | ||
| | step | string or HTMLElement[] | **required** Selector (or array of elements) for the step elements that will trigger changes. | | ||
| | offset | number (0 - 1, or string with "px") | How far from the top of the viewport to trigger a step. | 0.5 | | ||
| | progress | boolean | Whether to fire incremental step progress updates or not. | false | | ||
| | threshold | number (1 or higher) | The granularity of the progress interval in pixels (smaller = more granular). | 4 | | ||
| | once | boolean | Only trigger the step to enter once then remove listener. | false || | ||
| | debug | boolean | Whether to show visual debugging tools or not. | false | | ||
| | parent | HTMLElement[] | Parent element for step selector (use if you steps are in shadow DOM). | undefined | | ||
| | container | HTMLElement | Parent element for the scroll story (use if scrollama is nested in a HTML element with overflow set to `scroll` or `auto`) | undefined | | ||
@@ -232,23 +231,2 @@ #### scrollama.onStepEnter(callback) | ||
| ## Contributors | ||
| - [russellgoldenberg](https://github.com/russellgoldenberg) | ||
| - [gabrielflorit](https://github.com/gabrielflorit) | ||
| - [tbroadley](https://github.com/tbroadley) | ||
| - [jsonkao](https://github.com/jsonkao) | ||
| - [ianmcampbell](https://github.com/iainmcampbell) | ||
| - [ddazal](https://github.com/ddazal) | ||
| - [albinotonnina](https://github.com/albinotonnina) | ||
| - [SidKwok](https://github.com/SidKwok) | ||
| - [Eelsie](https://github.com/Eelsie) | ||
| - [jonnyscholes](https://github.com/jonnyscholes) | ||
| - [pldg](https://github.com/pldg) | ||
| - [andysongs](https://github.com/andysongs) | ||
| - [Ryshackleton](https://github.com/Ryshackleton) | ||
| - [steven0811](https://github.com/steven0811) | ||
| - [smnarnold](https://github.com/smnarnold) | ||
| - [tuckergordon](https://github.com/tuckergordon) | ||
| - [emma-k-alexandra](https://github.com/emma-k-alexandra) | ||
| - [noslouch](https://github.com/noslouch) | ||
| ## License | ||
@@ -255,0 +233,0 @@ |
@@ -230,4 +230,2 @@ import { selectAll } from "./dom"; | ||
| /* SETUP */ | ||
| setupScroll(); | ||
| const S = {}; | ||
@@ -245,2 +243,5 @@ | ||
| }) => { | ||
| setupScroll(container); | ||
| steps = selectAll(step, parent).map((node, index) => ({ | ||
@@ -247,0 +248,0 @@ index, |
@@ -1,4 +0,4 @@ | ||
| let previousScrollY = 0; | ||
| let currentScrollY = 0; | ||
| let comparisonScrollY = 0; | ||
| let previousScrollY; | ||
| let currentScrollY; | ||
| let comparisonScrollY; | ||
| let direction; | ||
@@ -18,6 +18,9 @@ | ||
| function setupScroll() { | ||
| document.addEventListener("scroll", onScroll); | ||
| function setupScroll(container) { | ||
| previousScrollY = 0; | ||
| currentScrollY = 0; | ||
| comparisonScrollY = 0; | ||
| document.addEventListener("scroll", () => onScroll(container)); | ||
| } | ||
| export { setupScroll, onScroll, direction, previousScrollY, currentScrollY }; |
Sorry, the diff of this file is not supported yet
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Improved metrics
- Lines of code
- increased by0.54%
937
Worsened metrics
- Total package byte prevSize
- decreased by-0.62%
363111
- Number of lines in readme file
- decreased by-8.03%
252
No dependency changes