dolly

3D scroll easy!

dolly.js - alpha version 0.1

download

Light & Easy!

Only 6 KB pakage and no JQuery needed

<link rel="stylesheet" href="dolly.min.css"> <div id="dolly-container"> <div class="dolly-wrap"> <section class="dolly-layer"></section> <section class="dolly-layer"></section> <section class="dolly-layer"></section> </div> </div> <script src="dolly.min.js"></script> let dolly = new Dolly(dollyContainer);

Fully customizable

let dolly = new Dolly(dollyContainer,{ ease:0.1, perspective: 3000, distance: 5000, fullpage: false, delay:1500, duration: 800, onlyAnchors: false, bodyClass: true, threshold:30, activeMenu: true, onReady: function(){ /* CALLED WHEN PLUGIN IS READY */ }, onScroll: function(index, scroll,direction,limit){ /* CALLED DURING SCROLL */ }, onChange: function(prev,index,scroll){ /* CALLED WHEN INDEX CHANGE */ }, onResize: function(prev,index,scroll){ /* CALLED WHEN WINDOW IT'S RESIZED */ } /* EXTERNAL METHODS */ stopDolly() - disable listeners for scroll & anchors startDolly() - enable listeners for scroll & anchors blockScroll(boolean) - enable or disable scroll getIndex() - return active INDEX getScroll() - return scroll position moveToIndex(index,duration) - move app to target index

Examples