{"repo":"geosigno/simpleParallax.js","free":true,"listed":false,"github":"https://github.com/geosigno/simpleParallax.js","clone":"git clone https://github.com/geosigno/simpleParallax.js.git","description":"Easy Parallax Effect for React & JavaScript","language":"TypeScript","stars":2157,"topics":["parallax","simple","scroll","image","javacript","animation","react","ui"],"license":"MIT","category":"ui-components","readme_excerpt":"simpleParallax.js simpleParallax.js is a lightweight, easy-to-use React and vanilla-JavaScript library that adds a parallax effect to any image. It works out of the box with React , Next.js , and plain JavaScript — the effect is applied directly to your tags, with no background images needed. While other plugins can be complex, simpleParallax.js is notable for its simplicity and impressive visual effects. Any image can be used. More info in the case study here. Give it a try! Installation Install the package with your favourite package manager: For the React version, react and react-dom are peer dependencies ( = 17 ) — they use the React already installed in your project. The package is written in TypeScript and ships type definitions for both entry points (React and vanilla), so no extra @types package is needed. Import it: Initialization React Simply add the following JavaScript code: Vanilla Giving the following HTML : simply add the following JavaScript code : You can also choose to apply the parallax on multiple images : Once simpleparallax has been correctly initialized, it adds the class on the container. simpleParallax now works with video : Settings Setting Type Default Hint --- --- --- --- orientation String up up - right - down - left - up left - up right - down left - down right scale Number 1.5 need to be above 1 overflow Boolean false delay Number 0.4 the delay is in second Watch out, sometimes this delay is causing issue on iOS devices #47 transition String 'cu","default_branch":null,"files":null,"tree":[],"storefront":"/r/geosigno","claimed":false,"request_supported":{"post":"https://gitbuyer.com/r/geosigno/simpleParallax.js/request-supported","requests":0},"note":"indexed from public GitHub; nothing is for sale on this page. Clone it from GitHub. Paid listings live at /search."}