You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
varparallax=require('scrollmonitor-parallax');vareases=require('eases');// https://github.com/mattdesl/eases// Create a root element. Parallax will start when this// element enters the viewport and stop when it exits.varparallaxRoot=parallax.create(domElement);// to make an element scroll at a speed relative to the// scroll parent, just add a value for speed.varparallaxChild2=parallaxRoot.add(domElement,0.5);// for more complex animations you can start and end positions.// If it's left blank, the start position is taken from the element's CSS.varparallaxChild=parallaxRoot.add(domElement,{start: {opacity: 0}end: {x: 100,y: 50,z: 100,opacity: 0.7},easing: {x: eases.linear,y: eases.linear,z: eases.circIn,opacity: eases.bounceIn}});
Existing ScrollMonitor
If you need to create your own ScrollMonitorContainer, you may create a parallax root and pass an existing container as the third parameter, and scrollmonitor-parallax will use that instead of using the default ScrollMonitorContainer instance:
varscrollMonitor=require('scrollmonitor');varparallax=require('scrollmonitor-parallax');varcontainer=scrollMonitor.createContainer(document.body);// Any other watching logic here.varparallaxRoot=parallax.create(domElement,null,container);// Any elements you wish to add to your parallax.