parallax-3d-lens-effect

The demonstration how to create the 3D parallax effect when moving mouse using the CSS transform.

In JavaScript, we only need to listen the mousemove event and set the transformation values into CSS variables. The background "rain effect" is created with canvas and animated using JavaScript.

To generate static HTML with assets from their source files is used the html-bundler-webpack-plugin.

This example uses the assets created by @agragregra WebDesign Master.

View and edit in browser

Setup

git clone https://github.com/webdiscus/parallax-3d-lens-effect.git
cd parallax-3d-lens-effect
npm i

View app

npm run view

Start development

npm start

Build app

npm run build