In the world of web development, adding interactive and visually appealing effects to your website can greatly enhance the user experience.
What is vanilla-tilt.js?
To begin using vanilla-tilt.js, you can either download the library from the official GitHub repository or include it via a CDN. The library is compatible with all modern browsers and doesn’t require any additional dependencies.
Download links are mentioned in the website.
You can also install it using npm
npm install vanilla-tilt
This library can be used in 2 ways as mentioned below
Script tag method
If you are going to use a script tag to include the library then it is very simple. Just add data-tilt attribute to your HTML element and you are good to go!
Manual initialization method
If you want to manually initialize tilt.js only on certain elements or on demand then you can do it this way:
This method can also be used in the case of React.js
vanilla-tilt.js is just 8.5kb minified so it is safe to use and won’t add up to your website size.
vanilla-tilt.js also supports features like the parallax effect, glare effect, reverse tilt, etc. Explore all the available options from their official website and have fun creating some interesting 3d effects ✌️
- Flutter lookup failed in @fields error (solved) - July 14, 2023
- Free open source alternative to Notion along with AI - July 13, 2023
- Threads API for developers for programmatic access - July 12, 2023