Показать сообщение отдельно
  #2 (permalink)  
Старый 25.10.2019, 10:04
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,109

VanillaTilt destroy
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>
Ответить с цитированием