Ефект пульсації або мерехтіння на CSS3

пульсації

Даний скрипт дуже підійде для реалістичності ефекту онлайн або офлайн статусу користувача на вашому сайті без використання gif зображень. Так що на темному сайті буде чудово виглядати по візуалізації і вам не потрібно буде виставляти кнопки. Так як цей скрипт замінить і користувач бачитиме, хто онлайн і знаходиться на інтернет ресурсі. У верхній частині сторінки біля нікнейму користувачів стоїть ось така іконка (помітна гостям). Якщо подивитися на неї, то вона мерехтить. При статусі ONline вона мерехтить зеленим кольором. На ній мерехтіння помітніше. Справа не в цьому посиланні, а в статусі користувача.

1. Сам CSS код ефекту

200?'200px':''+(this.scrollHeight+5)+'px');"> .pulse < animation-name: pulse; -webkit-animation-name: pulse; animation-duration: 1.5s; -webkit-animation-duration: 1.5s; animation-iteration-count: infinite;>> @keyframes pulse < 0% < transform: scale(0.9); opacity: 0.7; > 50% < transform: scale(1); opacity: 1; > 100% < transform: scale(0.9); opacity: 0.7;>>

@-webkit-keyframes pulse < 0% < -webkit-transform: scale(0.95); opacity: 0.7; > 50% < -webkit-transform: scale(1); opacity: 1; > 100% < -webkit-transform: scale(0.95); opacity: 0.7; > >

Якщо хочемо збільшити або зменшити мерехтіння статусу, можна просто замінити змінні scale( на свої );

2. Ну відповідно html

Для сайтів uCoz можна використовувати умовні оператори

PS- Даний скрипт дуже підійде для реалістичності ефекту онлайн/оффлайн статусу користувача на вашому сайті без використання gif зображень.Приклад застосування -Сторінка користувачів. У верхній частині сторінки біля нікнейму стоїть така іконка (видна гостям). Якщо подивитися на неї, то вона мерехтить.