20:41 Воскресенье 2025
Статистика Форума
Последние обновленные темы Самые популярные темы Самые активные Новые участники
Время в профиле прош... (0)
КПК - персональная с... (0)
Вид цитаты и code st... (0)
СТАЛКЕРСКИЙ МИНИ-ПРО... (0)
БЛОК ИНТЕРЕСНЫХ ФАКТ... (0)
Гид по Народной Соля... (27)
Бар «От заката до ра... (18)
Гид по прохождению м... (16)
Азы модостроения (14)
Баги и ошибки на сай... (8)
XemorDio(died) (626)
Бармен (146)
ExGooD (48)
habib (37)
Rayviner (19)
maksimstebnovskij5 (02.03.2023)
slitkovets (30.10.2022)
ianoiano62 (29.01.2022)
Timkalv (20.09.2021)
Myloisonau (03.09.2021)

  • Страница 1 из 1
  • 1
Огоньки с эффектом взрыва при наведении
XemorDio(died)Дата: Четверг, 21.01.2016, 13:21 | Сообщение # 1
Генерал-лейтенант
Группа: Свобода
Сообщений: 626
Награды: 3
Репутация: 4
Статус:

Описание:
Нашел интересный ява-скриптовый спецэффект, которым под Новый Год можно украсить страницы сайта. Нет, это не доставшие всех снежинки, это ёлочная гирлянда, лампочки которой весело лопаются при наведении на них курсора мыши. Почти что пупырчатый полиэтилен :)
Посмотреть на результат работы скрипта можно на странице автора. Там же, если заглянуть в исходники, можно легко разобраться как подключить его к своей странице, но я покажу вам свою версию установки под ucoz.

Внимание!
После установки гирлянды, вам ее будет ее перекрывать админ (юзер) бар, так что придется от него отказаться на какое-то время ! Вы должны будете установить код на всех страницах, где должна отображаться гирлянда
Код
<div id="lights"></div>
<?if($ADMIN_BAR$)?><?endif?>

После праздников, вы с легкостью можете вернуть админ бар. Чтобы обратно включить вывод админбара идете в быструю замену шаблонов, в поле "Что заменить" ставите
Код
<?if($ADMIN_BAR$)?><?endif?>

Поле "На что заменить" оставляете пустым

Установка:
1. Устанавливаем скрипты в нижней части сайта:
Код
<!-- Гирлянда -->
           <script src="/christmaslights/js/soundmanager2-nodebug-jsmin.js"></script>
           <script src="http://stalker-zona.3dn.ru/ucoz/NewYear/Lights/animation-min.js"></script>
           <script src="/christmaslights/js/christmaslights.js"></script>
           <!-- /Гирлянда -->

2. Устанавливаем стили в таблице стилей css
Код
/*========== Гирлянда ==========*/
#lights{position:absolute;left:0;top:0;width:100%;height: 275px;overflow:hidden;}
body {padding-top:30px}           
.wrapper {position:relative;z-index:1}
.xlsf-light{position:absolute}
body.fast .xlsf-light{opacity:.9}
.xlsf-fragment{position:absolute;background:transparent url(/christmaslights/img/bulbs-50x50-fragments.png) no-repeat 0 0;width:50px;height:50px}
.xlsf-fragment-box{position:absolute;left:0;top:0;width:50px;height:50px;*width:100%;*height:100%;display:none}
.xlsf-cover{position:fixed;left:0;top:0;width:100%;height:100%;background:#fff;opacity:1;z-index:999;display:none}
/*========== /Гирлянда ==========*/

Скачиваем прикрепленный архив, распаковываем и заливаем папку christmaslights в свой файловый менеджер. На этом установка завершена. Спасибо за внимание, Всех с наступающим новым годом :)

Скачать

Просьба JS скрипты залить себе на сайт.
 
  • Страница 1 из 1
  • 1
Поиск: