diff --git a/dist/scrollerful-auto.min.js b/dist/scrollerful-auto.min.js index 557a0f9..995d3bd 100644 --- a/dist/scrollerful-auto.min.js +++ b/dist/scrollerful-auto.min.js @@ -1,2 +1,2 @@ -/*! scrollerful v0.6.4 | (c) 2022-2024 Rémino Rem | ISC Licence */ +/*! scrollerful v1.0.0 | (c) 2022-2024 Rémino Rem | ISC Licence */ (function(f){typeof define==='function'&&define.amd?define(f):f();})((function(){'use strict';var e = "@media screen{@supports(scroll-snap-stop:always){.sclf--enabled .sclf--snap,.sclf--enabled.sclf--snap{scroll-snap-stop:normal;scroll-snap-type:y proximity}}.sclf--enabled .sclf--snap,.sclf--enabled.sclf--snap{overflow-y:auto}@supports(scroll-snap-stop:always){.sclf--enabled .sclf--snap .sclf,.sclf--enabled.sclf--snap .sclf{scroll-snap-align:start}}@supports(scroll-snap-stop:always){.sclf--enabled .sclf--x.sclf--snap,.sclf--enabled.sclf--snap .sclf--x,.sclf--enabled.sclf--snap:has(.sclf--x){scroll-snap-type:x proximity}}}@media screen{.sclf--enabled .sclf--snap{height:100%}.sclf--enabled .sclf--x{display:flex;flex-flow:row nowrap}.sclf--enabled .sclf--x.sclf--snap{overflow-x:auto;overflow-y:hidden}.sclf--enabled .sclf--x .sclf__float{height:100vh;height:100svh;left:0;max-height:none;max-width:100%;top:auto;width:100vw;width:100lvw}.sclf--enabled .sclf--x .sclf{flex-shrink:0;height:auto;width:300vw;width:300lvw}.sclf--enabled .sclf--x .sclf--padding{height:auto;width:100vw;width:100lvw}@supports(animation-timeline:scroll()){.sclf--enabled .sclf--x .sclf{view-timeline:--sclf-float x}}.sclf--enabled .sclf__ruler{background:none transparent;border:none;bottom:0;display:block;height:100vh;height:100lvh;left:-200%;pointer-events:none;position:absolute;top:0;-webkit-user-select:none;user-select:none;width:100vw;width:100lvw;z-index:-10}.sclf--enabled .sclf__float{align-items:center;display:flex;flex-flow:column;height:100vh;height:100lvh;justify-content:center;max-height:100%;overflow:hidden;position:sticky;top:0}.sclf--enabled .sclf__sprite,.sclf--enabled .sclf__sprite--contain,.sclf--enabled .sclf__sprite--cover{animation-duration:calc(var(--sclf-duration, 100)*1s);animation-fill-mode:both;animation-play-state:paused;animation-timing-function:linear}.sclf--enabled .sclf__sprite,.sclf--enabled .sclf__sprite--cover{animation-delay:calc(var(--sclf-cover, 0)*-100s + var(--sclf-delay, 0)*1s)}.sclf--enabled .sclf__sprite--contain{animation-delay:calc(var(--sclf-contain, 0)*-100s + var(--sclf-delay, 0)*1s)}.sclf--enabled .sclf{height:300vh;height:300lvh;position:relative}.sclf--enabled .sclf--padding{height:100vh;height:100lvh}@supports(animation-timeline:scroll()){.sclf--enabled .sclf{view-timeline:--sclf-float y}.sclf--enabled .sclf__sprite,.sclf--enabled .sclf__sprite--contain,.sclf--enabled .sclf__sprite--cover{animation-delay:0s;animation-play-state:running;animation-timeline:--sclf-float}.sclf--enabled .sclf__sprite,.sclf--enabled .sclf__sprite--cover{animation-range:cover calc(var(--sclf-delay, 0)*1%) cover calc(var(--sclf-duration, 100)*1%)}.sclf--enabled .sclf__sprite--contain{animation-range:contain calc(var(--sclf-delay, 0)*1%) contain calc(var(--sclf-duration, 100)*1%)}}}@supports(animation-timeline:scroll()){.sclf--enabled,.sclf--enabled .sclf--enabled{view-timeline:--sclf-float y}}";const calcContainProgress=(r,t,c)=>{if(t===c){const t=(r-c)/c*-1;switch(!0){case r<0:return t;case r>0:return t-1;default:return .5}}const e=r/(t-c)*-1;return 1==t(r-c)/(c+t)*-1;const r="sclf",o=`${r}--enabled`,s=`${r}--x`,c=`${r}--inside--contain`,i=`${r}--inside--cover`,a=`${r}__ruler`,d=`--${r}-contain`,l=`--${r}-cover`,u=`${r}:contain:enter`,m=`${r}:contain:exit`,v=`${r}:cover:enter`,g=`${r}:cover:exit`,y=`${r}:scroll`,p=`.${r}`,h=`.${r}`,E=`${r}_ruler`,b=`${r}_style`;let f;const $=(e,t=!1)=>t?e.scrollWidth:e.scrollHeight,L=e=>document.getElementById(E).getBoundingClientRect()[e?"width":"height"],w=(e,t,n)=>{const[r,o]=((...e)=>e.sort(((e,t)=>e-t)))(t,n);return e>=r&&e<=o},C=async(e,r)=>{const o=((e,r)=>{const{containerStart:o,containerSize:s,viewSize:c}=((e,t)=>{const{size:n,start:r}=((e,t=!1)=>{if(t){const{left:t,width:n}=e.getBoundingClientRect();return {size:n,start:t}}const{height:n,top:r}=e.getBoundingClientRect();return {size:n,start:r}})(e,t),o=((e,t)=>["auto","scroll"].includes(getComputedStyle(e).getPropertyValue("overflow-"+(t?"x":"y"))))(e,t);return {containerStart:r,containerSize:o?$(e,t):n,viewSize:o?n:L(t)}})(e,r);return {contain:calcContainProgress(o,s,c),cover:calcCoverProgress(o,s,c)}})(e,r);e.dispatchEvent(new CustomEvent(y,{detail:{progress:o},bubbles:!0,cancelable:!0,composed:!1}));},S=({target:e,detail:{progress:{contain:t,cover:n}}})=>{var r;w(n,0,1)?(e.style.setProperty(d,t),e.style.setProperty(l,n)):(r=e,[d,l].forEach((e=>r.style.removeProperty(e))));},z=(e,t,n,r,o)=>{w(t,0,1)?e.classList.contains(o)||(e.classList.add(o),e.dispatchEvent(new CustomEvent(n,{bubbles:!0,cancelable:!0,composed:!1}))):e.classList.contains(o)&&(e.classList.remove(o),e.dispatchEvent(new CustomEvent(r,{bubbles:!0,cancelable:!0,composed:!1})));},A=({target:e,detail:{progress:{contain:t}}})=>{z(e,t,u,m,c);},B=({target:e,detail:{progress:{cover:t}}})=>{z(e,t,v,g,i);},x=({target:e})=>{f&&cancelAnimationFrame(f),f=requestAnimationFrame((()=>{(async e=>{const t=e.classList.contains(s);Promise.all([e,...e.querySelectorAll(h)].map((e=>C(e,t))));})(e),f=null;}));},P=e=>{[e,...e.querySelectorAll(h)].forEach((e=>{e.addEventListener(y,S),e.addEventListener(y,B),e.addEventListener(y,A);}));};var m$1 = ()=>{(()=>{if(document.getElementById(b))return;const t=document.createElement("style");t.setAttribute("id",b),t.textContent=e,document.head.firstChild?document.head.insertBefore(t,document.head.firstChild):document.head.appendChild(t);})(),(()=>{if(document.getElementById(E))return;const e=document.createElement("div");e.setAttribute("id",E),e.classList.add(a),document.body.appendChild(e);})(),Array.from(document.querySelectorAll(p)).forEach((e=>{e.addEventListener("resize",x),e.addEventListener("scroll",x),P(e),x({target:e});})),window.addEventListener("resize",(()=>x({target:document.body}))),window.addEventListener("scroll",(()=>x({target:document.body}))),P(document.body),x({target:document.body}),document.documentElement.classList.add(o);};"interactive"===document.readyState?m$1():document.addEventListener("DOMContentLoaded",m$1);})); \ No newline at end of file diff --git a/dist/scrollerful.cjs b/dist/scrollerful.cjs index 2678739..d8ea181 100644 --- a/dist/scrollerful.cjs +++ b/dist/scrollerful.cjs @@ -1,4 +1,4 @@ -/*! scrollerful v0.6.4 | (c) 2022-2024 Rémino Rem | ISC Licence */ +/*! scrollerful v1.0.0 | (c) 2022-2024 Rémino Rem | ISC Licence */ (function (global, factory) { typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() : typeof define === 'function' && define.amd ? define(factory) : diff --git a/dist/scrollerful.min.js b/dist/scrollerful.min.js index 60c1158..68ab72c 100644 --- a/dist/scrollerful.min.js +++ b/dist/scrollerful.min.js @@ -1,2 +1,2 @@ -/*! scrollerful v0.6.4 | (c) 2022-2024 Rémino Rem | ISC Licence */ +/*! scrollerful v1.0.0 | (c) 2022-2024 Rémino Rem | ISC Licence */ (function(g,f){typeof exports==='object'&&typeof module!=='undefined'?module.exports=f():typeof define==='function'&&define.amd?define(f):(g=typeof globalThis!=='undefined'?globalThis:g||self,g.scrollerful=f());})(this,(function(){'use strict';var e = "@media screen{@supports(scroll-snap-stop:always){.sclf--enabled .sclf--snap,.sclf--enabled.sclf--snap{scroll-snap-stop:normal;scroll-snap-type:y proximity}}.sclf--enabled .sclf--snap,.sclf--enabled.sclf--snap{overflow-y:auto}@supports(scroll-snap-stop:always){.sclf--enabled .sclf--snap .sclf,.sclf--enabled.sclf--snap .sclf{scroll-snap-align:start}}@supports(scroll-snap-stop:always){.sclf--enabled .sclf--x.sclf--snap,.sclf--enabled.sclf--snap .sclf--x,.sclf--enabled.sclf--snap:has(.sclf--x){scroll-snap-type:x proximity}}}@media screen{.sclf--enabled .sclf--snap{height:100%}.sclf--enabled .sclf--x{display:flex;flex-flow:row nowrap}.sclf--enabled .sclf--x.sclf--snap{overflow-x:auto;overflow-y:hidden}.sclf--enabled .sclf--x .sclf__float{height:100vh;height:100svh;left:0;max-height:none;max-width:100%;top:auto;width:100vw;width:100lvw}.sclf--enabled .sclf--x .sclf{flex-shrink:0;height:auto;width:300vw;width:300lvw}.sclf--enabled .sclf--x .sclf--padding{height:auto;width:100vw;width:100lvw}@supports(animation-timeline:scroll()){.sclf--enabled .sclf--x .sclf{view-timeline:--sclf-float x}}.sclf--enabled .sclf__ruler{background:none transparent;border:none;bottom:0;display:block;height:100vh;height:100lvh;left:-200%;pointer-events:none;position:absolute;top:0;-webkit-user-select:none;user-select:none;width:100vw;width:100lvw;z-index:-10}.sclf--enabled .sclf__float{align-items:center;display:flex;flex-flow:column;height:100vh;height:100lvh;justify-content:center;max-height:100%;overflow:hidden;position:sticky;top:0}.sclf--enabled .sclf__sprite,.sclf--enabled .sclf__sprite--contain,.sclf--enabled .sclf__sprite--cover{animation-duration:calc(var(--sclf-duration, 100)*1s);animation-fill-mode:both;animation-play-state:paused;animation-timing-function:linear}.sclf--enabled .sclf__sprite,.sclf--enabled .sclf__sprite--cover{animation-delay:calc(var(--sclf-cover, 0)*-100s + var(--sclf-delay, 0)*1s)}.sclf--enabled .sclf__sprite--contain{animation-delay:calc(var(--sclf-contain, 0)*-100s + var(--sclf-delay, 0)*1s)}.sclf--enabled .sclf{height:300vh;height:300lvh;position:relative}.sclf--enabled .sclf--padding{height:100vh;height:100lvh}@supports(animation-timeline:scroll()){.sclf--enabled .sclf{view-timeline:--sclf-float y}.sclf--enabled .sclf__sprite,.sclf--enabled .sclf__sprite--contain,.sclf--enabled .sclf__sprite--cover{animation-delay:0s;animation-play-state:running;animation-timeline:--sclf-float}.sclf--enabled .sclf__sprite,.sclf--enabled .sclf__sprite--cover{animation-range:cover calc(var(--sclf-delay, 0)*1%) cover calc(var(--sclf-duration, 100)*1%)}.sclf--enabled .sclf__sprite--contain{animation-range:contain calc(var(--sclf-delay, 0)*1%) contain calc(var(--sclf-duration, 100)*1%)}}}@supports(animation-timeline:scroll()){.sclf--enabled,.sclf--enabled .sclf--enabled{view-timeline:--sclf-float y}}";const calcContainProgress=(r,t,c)=>{if(t===c){const t=(r-c)/c*-1;switch(!0){case r<0:return t;case r>0:return t-1;default:return .5}}const e=r/(t-c)*-1;return 1==t(r-c)/(c+t)*-1;const r="sclf",o=`${r}--enabled`,s=`${r}--x`,c=`${r}--inside--contain`,i=`${r}--inside--cover`,a=`${r}__ruler`,d=`--${r}-contain`,l=`--${r}-cover`,u=`${r}:contain:enter`,m=`${r}:contain:exit`,v=`${r}:cover:enter`,g=`${r}:cover:exit`,y=`${r}:scroll`,p=`.${r}`,h=`.${r}`,E=`${r}_ruler`,b=`${r}_style`;let f;const $=(e,t=!1)=>t?e.scrollWidth:e.scrollHeight,L=e=>document.getElementById(E).getBoundingClientRect()[e?"width":"height"],w=(e,t,n)=>{const[r,o]=((...e)=>e.sort(((e,t)=>e-t)))(t,n);return e>=r&&e<=o},C=async(e,r)=>{const o=((e,r)=>{const{containerStart:o,containerSize:s,viewSize:c}=((e,t)=>{const{size:n,start:r}=((e,t=!1)=>{if(t){const{left:t,width:n}=e.getBoundingClientRect();return {size:n,start:t}}const{height:n,top:r}=e.getBoundingClientRect();return {size:n,start:r}})(e,t),o=((e,t)=>["auto","scroll"].includes(getComputedStyle(e).getPropertyValue("overflow-"+(t?"x":"y"))))(e,t);return {containerStart:r,containerSize:o?$(e,t):n,viewSize:o?n:L(t)}})(e,r);return {contain:calcContainProgress(o,s,c),cover:calcCoverProgress(o,s,c)}})(e,r);e.dispatchEvent(new CustomEvent(y,{detail:{progress:o},bubbles:!0,cancelable:!0,composed:!1}));},S=({target:e,detail:{progress:{contain:t,cover:n}}})=>{var r;w(n,0,1)?(e.style.setProperty(d,t),e.style.setProperty(l,n)):(r=e,[d,l].forEach((e=>r.style.removeProperty(e))));},z=(e,t,n,r,o)=>{w(t,0,1)?e.classList.contains(o)||(e.classList.add(o),e.dispatchEvent(new CustomEvent(n,{bubbles:!0,cancelable:!0,composed:!1}))):e.classList.contains(o)&&(e.classList.remove(o),e.dispatchEvent(new CustomEvent(r,{bubbles:!0,cancelable:!0,composed:!1})));},A=({target:e,detail:{progress:{contain:t}}})=>{z(e,t,u,m,c);},B=({target:e,detail:{progress:{cover:t}}})=>{z(e,t,v,g,i);},x=({target:e})=>{f&&cancelAnimationFrame(f),f=requestAnimationFrame((()=>{(async e=>{const t=e.classList.contains(s);Promise.all([e,...e.querySelectorAll(h)].map((e=>C(e,t))));})(e),f=null;}));},P=e=>{[e,...e.querySelectorAll(h)].forEach((e=>{e.addEventListener(y,S),e.addEventListener(y,B),e.addEventListener(y,A);}));};var m$1 = ()=>{(()=>{if(document.getElementById(b))return;const t=document.createElement("style");t.setAttribute("id",b),t.textContent=e,document.head.firstChild?document.head.insertBefore(t,document.head.firstChild):document.head.appendChild(t);})(),(()=>{if(document.getElementById(E))return;const e=document.createElement("div");e.setAttribute("id",E),e.classList.add(a),document.body.appendChild(e);})(),Array.from(document.querySelectorAll(p)).forEach((e=>{e.addEventListener("resize",x),e.addEventListener("scroll",x),P(e),x({target:e});})),window.addEventListener("resize",(()=>x({target:document.body}))),window.addEventListener("scroll",(()=>x({target:document.body}))),P(document.body),x({target:document.body}),document.documentElement.classList.add(o);};return m$1;})); \ No newline at end of file diff --git a/dist/scrollerful.min.mjs b/dist/scrollerful.min.mjs index 3dfd22a..e8e57dd 100644 --- a/dist/scrollerful.min.mjs +++ b/dist/scrollerful.min.mjs @@ -1,2 +1,2 @@ -/*! scrollerful v0.6.4 | (c) 2022-2024 Rémino Rem | ISC Licence */ +/*! scrollerful v1.0.0 | (c) 2022-2024 Rémino Rem | ISC Licence */ var e = "@media screen{@supports(scroll-snap-stop:always){.sclf--enabled .sclf--snap,.sclf--enabled.sclf--snap{scroll-snap-stop:normal;scroll-snap-type:y proximity}}.sclf--enabled .sclf--snap,.sclf--enabled.sclf--snap{overflow-y:auto}@supports(scroll-snap-stop:always){.sclf--enabled .sclf--snap .sclf,.sclf--enabled.sclf--snap .sclf{scroll-snap-align:start}}@supports(scroll-snap-stop:always){.sclf--enabled .sclf--x.sclf--snap,.sclf--enabled.sclf--snap .sclf--x,.sclf--enabled.sclf--snap:has(.sclf--x){scroll-snap-type:x proximity}}}@media screen{.sclf--enabled .sclf--snap{height:100%}.sclf--enabled .sclf--x{display:flex;flex-flow:row nowrap}.sclf--enabled .sclf--x.sclf--snap{overflow-x:auto;overflow-y:hidden}.sclf--enabled .sclf--x .sclf__float{height:100vh;height:100svh;left:0;max-height:none;max-width:100%;top:auto;width:100vw;width:100lvw}.sclf--enabled .sclf--x .sclf{flex-shrink:0;height:auto;width:300vw;width:300lvw}.sclf--enabled .sclf--x .sclf--padding{height:auto;width:100vw;width:100lvw}@supports(animation-timeline:scroll()){.sclf--enabled .sclf--x .sclf{view-timeline:--sclf-float x}}.sclf--enabled .sclf__ruler{background:none transparent;border:none;bottom:0;display:block;height:100vh;height:100lvh;left:-200%;pointer-events:none;position:absolute;top:0;-webkit-user-select:none;user-select:none;width:100vw;width:100lvw;z-index:-10}.sclf--enabled .sclf__float{align-items:center;display:flex;flex-flow:column;height:100vh;height:100lvh;justify-content:center;max-height:100%;overflow:hidden;position:sticky;top:0}.sclf--enabled .sclf__sprite,.sclf--enabled .sclf__sprite--contain,.sclf--enabled .sclf__sprite--cover{animation-duration:calc(var(--sclf-duration, 100)*1s);animation-fill-mode:both;animation-play-state:paused;animation-timing-function:linear}.sclf--enabled .sclf__sprite,.sclf--enabled .sclf__sprite--cover{animation-delay:calc(var(--sclf-cover, 0)*-100s + var(--sclf-delay, 0)*1s)}.sclf--enabled .sclf__sprite--contain{animation-delay:calc(var(--sclf-contain, 0)*-100s + var(--sclf-delay, 0)*1s)}.sclf--enabled .sclf{height:300vh;height:300lvh;position:relative}.sclf--enabled .sclf--padding{height:100vh;height:100lvh}@supports(animation-timeline:scroll()){.sclf--enabled .sclf{view-timeline:--sclf-float y}.sclf--enabled .sclf__sprite,.sclf--enabled .sclf__sprite--contain,.sclf--enabled .sclf__sprite--cover{animation-delay:0s;animation-play-state:running;animation-timeline:--sclf-float}.sclf--enabled .sclf__sprite,.sclf--enabled .sclf__sprite--cover{animation-range:cover calc(var(--sclf-delay, 0)*1%) cover calc(var(--sclf-duration, 100)*1%)}.sclf--enabled .sclf__sprite--contain{animation-range:contain calc(var(--sclf-delay, 0)*1%) contain calc(var(--sclf-duration, 100)*1%)}}}@supports(animation-timeline:scroll()){.sclf--enabled,.sclf--enabled .sclf--enabled{view-timeline:--sclf-float y}}";const calcContainProgress=(r,t,c)=>{if(t===c){const t=(r-c)/c*-1;switch(!0){case r<0:return t;case r>0:return t-1;default:return .5}}const e=r/(t-c)*-1;return 1==t(r-c)/(c+t)*-1;const r="sclf",o=`${r}--enabled`,s=`${r}--x`,c=`${r}--inside--contain`,i=`${r}--inside--cover`,a=`${r}__ruler`,d=`--${r}-contain`,l=`--${r}-cover`,u=`${r}:contain:enter`,m=`${r}:contain:exit`,v=`${r}:cover:enter`,g=`${r}:cover:exit`,y=`${r}:scroll`,p=`.${r}`,h=`.${r}`,E=`${r}_ruler`,b=`${r}_style`;let f;const $=(e,t=!1)=>t?e.scrollWidth:e.scrollHeight,L=e=>document.getElementById(E).getBoundingClientRect()[e?"width":"height"],w=(e,t,n)=>{const[r,o]=((...e)=>e.sort(((e,t)=>e-t)))(t,n);return e>=r&&e<=o},C=async(e,r)=>{const o=((e,r)=>{const{containerStart:o,containerSize:s,viewSize:c}=((e,t)=>{const{size:n,start:r}=((e,t=!1)=>{if(t){const{left:t,width:n}=e.getBoundingClientRect();return {size:n,start:t}}const{height:n,top:r}=e.getBoundingClientRect();return {size:n,start:r}})(e,t),o=((e,t)=>["auto","scroll"].includes(getComputedStyle(e).getPropertyValue("overflow-"+(t?"x":"y"))))(e,t);return {containerStart:r,containerSize:o?$(e,t):n,viewSize:o?n:L(t)}})(e,r);return {contain:calcContainProgress(o,s,c),cover:calcCoverProgress(o,s,c)}})(e,r);e.dispatchEvent(new CustomEvent(y,{detail:{progress:o},bubbles:!0,cancelable:!0,composed:!1}));},S=({target:e,detail:{progress:{contain:t,cover:n}}})=>{var r;w(n,0,1)?(e.style.setProperty(d,t),e.style.setProperty(l,n)):(r=e,[d,l].forEach((e=>r.style.removeProperty(e))));},z=(e,t,n,r,o)=>{w(t,0,1)?e.classList.contains(o)||(e.classList.add(o),e.dispatchEvent(new CustomEvent(n,{bubbles:!0,cancelable:!0,composed:!1}))):e.classList.contains(o)&&(e.classList.remove(o),e.dispatchEvent(new CustomEvent(r,{bubbles:!0,cancelable:!0,composed:!1})));},A=({target:e,detail:{progress:{contain:t}}})=>{z(e,t,u,m,c);},B=({target:e,detail:{progress:{cover:t}}})=>{z(e,t,v,g,i);},x=({target:e})=>{f&&cancelAnimationFrame(f),f=requestAnimationFrame((()=>{(async e=>{const t=e.classList.contains(s);Promise.all([e,...e.querySelectorAll(h)].map((e=>C(e,t))));})(e),f=null;}));},P=e=>{[e,...e.querySelectorAll(h)].forEach((e=>{e.addEventListener(y,S),e.addEventListener(y,B),e.addEventListener(y,A);}));};var m$1 = ()=>{(()=>{if(document.getElementById(b))return;const t=document.createElement("style");t.setAttribute("id",b),t.textContent=e,document.head.firstChild?document.head.insertBefore(t,document.head.firstChild):document.head.appendChild(t);})(),(()=>{if(document.getElementById(E))return;const e=document.createElement("div");e.setAttribute("id",E),e.classList.add(a),document.body.appendChild(e);})(),Array.from(document.querySelectorAll(p)).forEach((e=>{e.addEventListener("resize",x),e.addEventListener("scroll",x),P(e),x({target:e});})),window.addEventListener("resize",(()=>x({target:document.body}))),window.addEventListener("scroll",(()=>x({target:document.body}))),P(document.body),x({target:document.body}),document.documentElement.classList.add(o);};export{m$1 as default}; \ No newline at end of file diff --git a/dist/scrollerful.mjs b/dist/scrollerful.mjs index 20da54f..e09a083 100644 --- a/dist/scrollerful.mjs +++ b/dist/scrollerful.mjs @@ -1,4 +1,4 @@ -/*! scrollerful v0.6.4 | (c) 2022-2024 Rémino Rem | ISC Licence */ +/*! scrollerful v1.0.0 | (c) 2022-2024 Rémino Rem | ISC Licence */ var style = "@media screen{@supports(scroll-snap-stop:always){.sclf--enabled .sclf--snap,.sclf--enabled.sclf--snap{scroll-snap-stop:normal;scroll-snap-type:y proximity}}.sclf--enabled .sclf--snap,.sclf--enabled.sclf--snap{overflow-y:auto}@supports(scroll-snap-stop:always){.sclf--enabled .sclf--snap .sclf,.sclf--enabled.sclf--snap .sclf{scroll-snap-align:start}}@supports(scroll-snap-stop:always){.sclf--enabled .sclf--x.sclf--snap,.sclf--enabled.sclf--snap .sclf--x,.sclf--enabled.sclf--snap:has(.sclf--x){scroll-snap-type:x proximity}}}@media screen{.sclf--enabled .sclf--snap{height:100%}.sclf--enabled .sclf--x{display:flex;flex-flow:row nowrap}.sclf--enabled .sclf--x.sclf--snap{overflow-x:auto;overflow-y:hidden}.sclf--enabled .sclf--x .sclf__float{height:100vh;height:100svh;left:0;max-height:none;max-width:100%;top:auto;width:100vw;width:100lvw}.sclf--enabled .sclf--x .sclf{flex-shrink:0;height:auto;width:300vw;width:300lvw}.sclf--enabled .sclf--x .sclf--padding{height:auto;width:100vw;width:100lvw}@supports(animation-timeline:scroll()){.sclf--enabled .sclf--x .sclf{view-timeline:--sclf-float x}}.sclf--enabled .sclf__ruler{background:none transparent;border:none;bottom:0;display:block;height:100vh;height:100lvh;left:-200%;pointer-events:none;position:absolute;top:0;-webkit-user-select:none;user-select:none;width:100vw;width:100lvw;z-index:-10}.sclf--enabled .sclf__float{align-items:center;display:flex;flex-flow:column;height:100vh;height:100lvh;justify-content:center;max-height:100%;overflow:hidden;position:sticky;top:0}.sclf--enabled .sclf__sprite,.sclf--enabled .sclf__sprite--contain,.sclf--enabled .sclf__sprite--cover{animation-duration:calc(var(--sclf-duration, 100)*1s);animation-fill-mode:both;animation-play-state:paused;animation-timing-function:linear}.sclf--enabled .sclf__sprite,.sclf--enabled .sclf__sprite--cover{animation-delay:calc(var(--sclf-cover, 0)*-100s + var(--sclf-delay, 0)*1s)}.sclf--enabled .sclf__sprite--contain{animation-delay:calc(var(--sclf-contain, 0)*-100s + var(--sclf-delay, 0)*1s)}.sclf--enabled .sclf{height:300vh;height:300lvh;position:relative}.sclf--enabled .sclf--padding{height:100vh;height:100lvh}@supports(animation-timeline:scroll()){.sclf--enabled .sclf{view-timeline:--sclf-float y}.sclf--enabled .sclf__sprite,.sclf--enabled .sclf__sprite--contain,.sclf--enabled .sclf__sprite--cover{animation-delay:0s;animation-play-state:running;animation-timeline:--sclf-float}.sclf--enabled .sclf__sprite,.sclf--enabled .sclf__sprite--cover{animation-range:cover calc(var(--sclf-delay, 0)*1%) cover calc(var(--sclf-duration, 100)*1%)}.sclf--enabled .sclf__sprite--contain{animation-range:contain calc(var(--sclf-delay, 0)*1%) contain calc(var(--sclf-duration, 100)*1%)}}}@supports(animation-timeline:scroll()){.sclf--enabled,.sclf--enabled .sclf--enabled{view-timeline:--sclf-float y}}"; const calcContainProgress = (containerStart, containerSize, viewSize) => {