Новогодняя гирлянда как вконтакте

234
8 из 10
Проголосовало: 4




Новогодняя гирлянда как в социальной сети вконтакте, при наведении на которую гирлянда начинает мерцать.
Для установки вставьте код туда где хотите видеть гирлянду:
Код
<svg xmlns="http://www.w3.org/2000/svg" width="165" height="48" fill="none"> <style>:root {--red: #FF4F72;--green: #4BB34B;--blue: #78D2FF;--yellow: #FFD54F;}svg .lamp {animation-play-state: paused;}svg:hover .lamp {animation-play-state: running;}.lamp { --t: 2s; animation-name: blink; animation-duration: var(--t); animation-iteration-count: infinite; animation-timing-function: step-end;}.lamp:nth-child(1n) { animation-delay: calc(var(--t) / -4 * 3);}.lamp:nth-child(2n) { animation-delay: calc(var(--t) / -4 * 2);}.lamp:nth-child(3n) { animation-delay: calc(var(--t) / -4 * 1);}.lamp:nth-child(4n) { animation-delay: calc(var(--t) / -4 * 0);}@keyframes blink { 0% {fill: var(--red)} 25% {fill: var(--yellow)} 50% {fill: var(--green)} 75% {fill: var(--blue)} 100% {fill: var(--red)}} </style> <g clip-path="url(#clip0)"><path d="M11.15 5.64c-.41 1.6-1.58 2.59-2.62 2.22S7 5.9 7.4 4.32c.4-1.58 1.58-2.58 2.62-2.22 1.05.37 1.5 1.96 1.13 3.54z" class="lamp"></path><path d="M25.37 7.25c-.33 1.6-1.44 2.66-2.5 2.34-1.04-.31-1.62-1.86-1.3-3.48.32-1.6 1.44-2.66 2.49-2.35 1.05.3 1.64 1.88 1.3 3.49z" class="lamp"></path><path d="M40.4 8.31c-.13 1.64-1.17 2.82-2.27 2.62-1.1-.2-1.8-1.7-1.62-3.34.18-1.64 1.2-2.79 2.26-2.57 1.07.21 1.76 1.64 1.63 3.3z" class="lamp"></path><path d="M55.39 8.86c-.06 1.65-.99 2.93-2.08 2.85-1.1-.09-1.92-1.49-1.84-3.14.08-1.65 1.01-2.92 2.08-2.84 1.07.08 1.9 1.48 1.84 3.13z" class="lamp"></path><path d="M70.45 9.02c0 1.65-.91 2.96-2 2.94-1.1-.03-1.98-1.4-1.93-3.05.05-1.64.93-2.95 2-2.93 1.08.02 1.94 1.38 1.93 3.04z" class="lamp"></path><path d="M85.54 8.6c.05 1.65-.81 3.05-1.9 3.08-1.1.02-2-1.31-2.02-2.94-.02-1.63.84-3.01 1.9-3.05 1.07-.03 1.97 1.26 2.02 2.91z" class="lamp"></path><path d="M100.46 7.33c.32 1.61-.28 3.17-1.31 3.49-1.03.31-2.23-.79-2.48-2.41-.25-1.63.32-3.14 1.35-3.43 1.02-.29 2.13.74 2.44 2.35z" class="lamp"></path><path d="M115.33 5.97c.36 1.6-.19 3.18-1.23 3.52s-2.17-.65-2.53-2.27c-.36-1.62.19-3.18 1.22-3.52 1.04-.35 2.16.66 2.54 2.27z" class="lamp"></path><path d="M130.1 4.08c.43 1.59-.06 3.18-1.09 3.57-1.02.38-2.2-.6-2.62-2.18-.42-1.58.07-3.18 1.1-3.57 1.03-.39 2.2.59 2.62 2.18z" class="lamp"></path><path d="M.33.33a432.52 432.52 0 00135.34 0" stroke="#555E69" stroke-width=".75" stroke-miterlimit="10" stroke-linecap="round"></path> </g> <defs><clipPath id="clip0"> <path fill="#fff" d="M0 0h136v11.96H0z"></path></clipPath> </defs></svg>  
   
Автор публикации: Загрузка
Загрузка
CSIL, это его n материал
Источник: http://theps.art
  • Оставить первым комментарий:
Добавлять комментарии могут только зарегистрированные пользователи.
Регистрация | Вход
Меню сайта
Категории
Для помощи создания сайта uCoz 25
Скрипты и модификации для Ucoz 2126
Шаблоны форумов Ucoz 28
Шаблоны сайтов Ucoz 432
Авторство Webo4ki 309
php скрипты для ucoz 57
Графика для uCoz 40
Мини-чат
Последние комментарии
  • geleson2222 написал:
  • ?
  • Doc120 написал:
  • /* Скрывает каперайт ucoz */
    .banner_u {
    opacity:0.2 ;
    }
    /* ----------------- */
    opacity:0.1 ; это легальное скрытее $POWERED_BY$
    ставим в ccs не ставте 0.0 тоже за банят 1.1 можно сам пользуюсь.
  • Doc120 написал:
  • Ставим в ccs и все
    /* Скрывает каперайт ucoz */
    .banner_u {
    opacity:0.2 ;
    }
    /* ----------------- */
  • topkalife написал:
  • Было бы лучше если бы данный скрипт работал)
  • k43 написал:
  • Возможно из-за капчи для пользователей
    Последние темы
    Опрос
    333
    А
    Р
    Что произойдёт: $("#...
    Статистика
    Анализ интернет сайта
    0
    онлайн
    0
    наших
    0
    чужих
    Онлайн всего: 1
    Гостей: 1
    Пользователей: 0
    0
    Сегодня были
    Топ пользователей: