Parachute JS - jQuery smooth scrolling/parallax
Download
;(function($){ /* -------------------- window ready -------------------- */ $(window).ready(function(){ /* -------------------- page setup -------------------- */ Parachute.page({ scrollContainer: '#scrollContainer', heightContainer: '#fakeScrollContainer' }); /* -------------------- parallax -------------------- */ Parachute.parallax({ element: '.js-parallax-1', pxToMove: -400 // topTriggerOffset: 200 }); Parachute.parallax({ element: '.js-parallax-2', pxToMove: -200 }); // accepts array of selectors // Parachute.parallax({ // element: ['.js-parallax-2', '.js-parallax-1'], // pxToMove: -200 // }); /* -------------------- sequence/trigger -------------------- */ Parachute.sequence({ element: '.js-parallax-1', callback: function(active) { if (active) { $(this.$element).addClass('test'); } else { $(this.$element).removeClass('test'); } } }); // accepts array of selectors // Parachute.sequence({ // element: ['.js-parallax-1', '.js-parallax-2'], // callback: function(active) { // if (active) { // $(this.$element).addClass('test'); // } else { // $(this.$element).removeClass('test'); // } // } // }); /* -------------------- init -------------------- */ Parachute.init(); }); })(jQuery);