|Views Total:||309 views|
|Official Page:||Go to website|
|Last Update:||March 23, 2023|
It is inspired by Apple TV and provides unparalleled depth and immersion when showing designs to your users.
How to use it:
1. Download and load the Hover3D.js library.
2. Initialize the Hover3D on your element. That’s it.
<div class="card"> ... Layer 1 ... ... Layer 2 ... ... ... ... Layer n ... </div>
3. Customize the hover effect by overriding the default parameters.
// X-axis offset myHover3D.xOffset = 10; // Y-axis offset myHover3D.yOffset = 10; // How fast the element reacts to cursor movement myHover3D.attack = 0.1; // How fast the element repairs its initial state when your cursor leaves it myHover3D.release = 0.5; // Sets the distance between the user and the z=0 plane myHover3D.perspective = 500;