I am doing a glass morph card via dreaded tutorial(almost out of hell!). I have downloaded the Vanilla Tilt JS, added the script to my body, added query selector to my element but still nothing ?! My recent mistakes have been ridiculous and I have been over thinking everything therefore missing the simple! Please help !
VanillaTilt.init(document.querySelector(".card"), {
max: 25,
speed: 400,
glare: true,
"max-glare": 1,
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/vanilla-tilt/1.7.2/vanilla-tilt.min.js" integrity="sha512-K9tDZvc8nQXR1DMuT97sct9f40dilGp97vx7EXjswJA+/mKqJZ8vcZLifZDP+9t08osMLuiIjd4jZ0SM011Q+w==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<div class="card">
<div class="content">
<h2>02</h2>
<h3>Tech Stuff</h3>
<p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Consequuntur tenetur laborum repellendus maxime excepturi nisi enim? Perferendis est nulla explicabo?</p>
<a href="#">Check it out</a>
</div>
</div>
<div class="card">
<div class="content">
<h2>03</h2>
<h3>Tech Stuff</h3>
<p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Consequuntur tenetur laborum repellendus maxime excepturi nisi enim? Perferendis est nulla explicabo?</p>
<a href="#">Check it out</a>
</div>
</div>