эффект пульсирующей кнопки. Как?

[Korban]

Подскажите как сделать эффект пульсирующей кнопки? хочу чтобы кнопка запуска видео (значок ютюб) пульсировал

[spoon]

Встроенные эффекты смотрели?

[Korban]

вот пример кнопки - http://спк-лазурный.рф/red

из кнопки выходят увеличивающиеся пульсирующие окружности

[Gudwinn]

Korban, Привет! В общем либо перетаскиваешь в проект html вставку и выбираешь в ней тип css в медиа запросе(тогда <style></style> убрать из кода), либо по классике в исходнике страницы , выбираешь между тегами head , и вставляешь этот код

Код: Выделить всё

<style>
@-webkit-keyframes pulse {
      0% {
        -ms-transform: scale(0.5);-webkit-transform: scale(0.5);transform: scale(0.5);
        opacity: 0;
      }
      10% {
        opacity: 1;
      }
      20% {
        -ms-transform: scale(1.2);-webkit-transform: scale(1.2);transform: scale(1.2);
        opacity: 0;
      }
      100% {
        -ms-transform: scale(1.2);-webkit-transform: scale(1.2);transform: scale(1.2);
        opacity: 0;
      }
    }
    @keyframes pulse {
      0% {
        -ms-transform: scale(0.5);-webkit-transform: scale(0.5);transform: scale(0.5);
        opacity: 0;
      }
      10% {
        opacity: 1;
      }
      20% {
        -ms-transform: scale(1.2);-webkit-transform: scale(1.2);transform: scale(1.2);
        opacity: 0;
      }
      100% {
        -ms-transform: scale(1.2);-webkit-transform: scale(1.2);transform: scale(1.2);
        opacity: 0;
      }
    }
.wrap_blick::after{   
    content: "";
    position: absolute;
    top: -20px;
    right: -20px;
    bottom: -20px;
    left: -20px;
    border-radius: 50%;
    -webkit-animation: pulse 7s linear infinite;
    animation: pulse 7s linear infinite;
    pointer-events: none;
    cursor: default;
    border: inherit;
}
</style>


В самом элементе, которому надо задать блик, в html исходнике элемента в теге пишешь это: class="wrap_blick" Естественно, этому элементу надо задать границу, её цвет и радиус в билдере как обычно, вот собственно и всё. Частоту появления пульсирующих анимаций, можешь регулировать, меняя значение - 7s (это сейчас по умолчанию стоит)

[Korban]

Благодарю за обратную связь, Gudwinn
в предпросмотре не работает этот скрипт? заливать надо на хостинг?

[Gudwinn]

Korban, Работает в предпросмотре, без проблем

[Alex15963]

Привет Кирилл! Давно тебя не было видно! А в предпросмотре точно должно быть видно? Что-то у меня не видно. Вот проект

[Cheririna]

Можно как то так

[Cheririna]

Здесь как в примере

[e332va]

Если нужна такая как на сайте: http://www.orelplazmatv.ru
То делается легко, смотрите фото:

[Alex15963]

Спасибо ребята!!!
Cheririna - супер.

[Eric]

Alex15963, расширение

[Alex15963]

Дим. Спасибки!!!

[Gudwinn]

Alex15963, Алекс привет! Да, немного занят был... В проекте всё должно работать, вы элементу класс нужный не забыли добавить?

[SuperBatya]

А как пользоваться этим расширением? На 14 версии ничего

[Eric]

SuperBatya, что мешает поставить v16 и посмотреть. На крайний случай есть VirtualBox, если 30 дней демки не хватило.