Ява скрипт падающий снег, JS

Падающий снег по экрану. Вернее снежинки разного размера, скрипт показал или совместно создали совместно с ИИ. Очень красиво, можно украсить страницу под Новый год или на всю зиму.

<script src="https://1promtai.ru/wp-content/themes/1PROMTRU/script/sneg.js"></script>

Вот код скрипта:

// Функция для создания снежинки
function createSnowflake() {
  const snowFlake = document.createElement('div');
  snowFlake.innerHTML = '❄';
  snowFlake.style.cssText = 'color: white; font-size: ' + Math.random() * 24 + 'px; animation: fall ' + (Math.random() * 3 + 2) + 's linear infinite';
  document.body.appendChild(snowFlake);

  // Стилизация и позиционирование снежинки
  snowFlake.classList.add('snowflake');
  snowFlake.style.left = Math.random() * window.innerWidth + 'px';

  // Анимация падения
  snowFlake.style.animationName = 'fall';
  snowFlake.style.animationDuration = Math.random() * 3 + 5 + 's';
  snowFlake.style.animationTimingFunction = 'linear';
  snowFlake.style.animationIterationCount = 'infinite';

  // Удаление снежинки после падения
  setTimeout(() => {
    snowFlake.remove();
  }, 5000);
}

// Добавление анимации падения
const style = document.createElement('style');
style.innerHTML = `
  @keyframes fall {
    to {
      transform: translateY(100vh);
    }
  }
`;
document.head.appendChild(style);

// Создание снежинок каждые 100 миллисекунд
setInterval(createSnowflake, 100);

Стили

.snowflake {
    position: fixed;
    top: -10px;
    z-index: 9999;
    user-select: none;
    pointer-events: none;
  }

Метки: на сайт, падающие, сайт, скрипт, снег, снежинки, яваскрипт

Этот сайт использует Akismet для борьбы со спамом. Узнайте, как обрабатываются ваши данные комментариев.