ethereal,
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
.items{
display: flex;
justify-content: space-around;
}
.items div {
width: 150px;
height: 150px;
background: coral;
}
</style>
<script src="https://cdnjs.cloudflare.com/ajax/libs/vanilla-tilt/1.7.0/vanilla-tilt.min.js"></script>
</head>
<body>
<div class="items">
<div class="js-tilt"></div>
<div class="js-tilt"></div>
<div class="js-tilt"></div>
</div>
<button id="destroy-button">Destroy</button>
<button id="enable-button">Enable</button>
<script>
let destroyBox = document.querySelectorAll(".js-tilt");
let settings = {
max: 10,
speed: 3000,
scale: 0.8,
perspective: 1000
};
const init = () => VanillaTilt.init(destroyBox, settings);
init();
document.querySelector("#destroy-button").addEventListener("click", function () {
destroyBox.forEach(el => el.vanillaTilt.destroy());
});
document.querySelector("#enable-button").addEventListener("click", init);
</script>
</body>
</html>
