Ssylka

Новогодняя ёлка в QR-коде с музыкой

В статье описан способ создания анимированной новогодней ёлки, снеговиков и падающих снежинок, умещающихся в QR-код. Используя dataUrl, html, css, js и Unicode символы, автор достиг компактности кода, позволяющего поместить в QR-код анимированное изображение и музыку.
Новогодняя ёлка в QR-коде с музыкой
Изображение носит иллюстративный характер

Для отображения ёлки, подарков, снеговиков и текста "2025" используются символы Unicode, а размер шрифта динамически подстраивается под ширину и высоту экрана, чтобы ёлка не вылезала за границы. При помощи js, подарки и снеговики генерируются в цикле и добавляются на страницу. Снежинки реализованы через setInterval, они обновляются каждые 20 мс, имитируя падение с псевдослучайной траекторией.

Для музыкального сопровождения был взят midi файл мелодии "Carol of the Bells", преобразованный в компактную строку. Звук создается с использованием Web Audio API, где на основе строки данных создается массив семплов, добавляются гармоники для более натурального звучания и проигрывается при клике пользователя на ёлку. При этом, из-за ограничений браузера, музыку можно проиграть только после взаимодействия пользователя со страницей.


Новое на сайте

18880Почему даже элитные суперраспознаватели проваливают тесты на выявление дипфейков без... 18879Шесть легендарных древних городов и столиц империй, местоположение которых до сих пор... 18878Обзор самых необычных медицинских диагнозов и клинических случаев 2025 года 18877Критическая уязвимость CVE-2025-14847 в MongoDB открывает удаленный доступ к памяти... 18876Научное обоснование классификации солнца как желтого карлика класса G2V 18875Как безграничная преданность горным гориллам привела Дайан Фосси к жестокой гибели? 18874Новый родственник спинозавра из Таиланда меняет представления об эволюции хищников Азии 18873Как новая электрохимическая технология позволяет удвоить добычу водорода и снизить... 18872Могут ли ледяные гиганты Уран и Нептун на самом деле оказаться каменными? 18871Внедрение вредоносного кода в расширение Trust Wallet привело к хищению 7 миллионов... 18870Проверка клинического мышления на основе редких медицинских случаев 2025 года 18869Реконструкция черепа возрастом 1,5 миллиона лет меняет представление об эволюции Homo... 18868Почему декабрь — идеальное время для навигации по сокровищам звездного неба северного... 18867Смертельная угроза немониторируемых вулканов и глобальные последствия игнорирования... 18866Вулканическая цепь коконукос: уникальный природный феномен в сердце колумбийских Анд