Если в прошлой статье я рассказала об анимированных новогодних украшениях для сайта - веточке ели и гирлянде, то сейчас речь об еще одной находке - музыкальной еловой ветке. Смотрится тоже симпатично. Взглянуть можете на сайте (весной уберу 😉) Мама в Интернете.
Вообще, мне нравится добавлять у углы сайта небольшие элементы. Не загромождает сайт и в то же время украшает.
Самым первым опытом были новогодние колокольчики.
А теперь, как добавить на сайт музыкальную новогоднюю веточку с шариками.
Делается это очень просто, без вмешательств в код сайта.
1. В настройках сайта нужно зайти в пункт "Дизайн". И добавить новый гаджет
2. Выбрать из всех гаджетов гаджет HTML/JavaScript.
3. В поле "Содержание" вставить скопированный код (источник):
<div id="christmas" onclick="soundClick()"><img src="http://www.csomsk.ru/csomsk/christmas-1.png" title="С Новым Годом!" />
</div>
<style>
#christmas {
display: block;
position: fixed;
top: 0;
left: 0;
cursor: pointer;
}
</style>
<script>
function soundClick() {
var audio = new Audio();
audio.src = 'http://www.csomsk.ru/csomsk/Jingle_bells.mp3';
audio.autoplay = true;
}
</script>
Название гаджета можно оставить пустым. Главное - не забыть, где Вы его расположили, чтобы весной удалить. Можете, конечно и навсегда оставить 😂
4. Нажать кнопку "Сохранить".
При нажатии на веточку заиграет приятная новогодняя мелодия 🎵🎵🎵
P.S. Здесь еще есть новогодние украшения для сайта.
От всей души поздравляю Вас с наступающим Новым годом!
Мария, спасибо Вам за очередное Новогоднее украшательство! Эта музыкальная веточка изумительная! Как всегда, с Вашего позволения, забираю себе на сайт. Люблю всё красивое, как у Вас на сайте!
ОтветитьУдалитьМою новогоднюю страницу можно посмотреть тут: https://volga-sub.blogspot.com/
И Вам спасибо за комментарий) Ваша новогодняя страница поднимает настроение)))
УдалитьСпасибо! С Новым Годом Вас!
Удалить