JavaScript анимация кнопки вызова диспетчера или менеджера через Skype или другой мессенджер выполнятся через таймеры JavaScript. Верстаем заготовку кнопки, позиционируем её (в нашем случае нижняя правая часть страницы); в атрибуте href прописываем псевдопротокол skype и название учётной записи, на которую будет осуществлён звонок.
JavaScript анимация кнопки
Готовый пример JavaScript анимации кнопки
HTML-код кнопки вызова диспетчера:
<a class="btnphone" href="skype:ЛОГИНВСКАЙПЕ?call">☎</a>
CSS-код кнопки:
a{
text-decoration: none;
display: block;
position: absolute;
font-size: 70px;
background-color: #369;
color: #fff;
width: 110px;
height: 110px;
text-align: center;
line-height: 110px;
border-radius: 110px;
bottom: 20px; right: 20px;
}
JavaScript для анимации кнопки:
var btnPhone = document.querySelectorAll(".btnphone")[0],
flag = true, i = 1, tick = 100;
var step = 0.05;
function anima(){
if( i > 0.2 && flag){
i -= step;
} else flag = false;
if (i <= 1 && !flag){
i += step;
} else flag = true;
btnPhone.style.opacity = i;
setTimeout(anima, tick);
}
anima();
Анимацию кнопки можно сделать и при помощи CSS-свойства animation, которое позволяет настроить время анимации, количество кадров, какие CSS-свойства при анимации меняются и т.д.