Blank page

LET'S GO!

Кликни правой клавишей на элементе кнопка и выбери Add CSS Class Name.
Укажи класс: btn-effect

Код для кнопки в Зеро блок

Добавьте на страницу блок T123 и поместите в него код который находится ниже.

Опубликуй страницу и проверь отображение.

<!--Код для эффекта кнопки в Зеро блок с классом btn-effect-->

<script>
    $('.btn-effect').addClass('autoflash').append('<div class="flash lighting" style="height: 100%; width: 50px; top: 0px; left: -30px;"></div>');
</script>

<style>
.autoflash{
    position: relative;
    overflow: hidden;
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
}

.flash{
    content: "";
    background: linear-gradient(90deg, rgba(255, 255, 255, .1), rgba(255, 255, 255, .4));
    height: 100%;
    width: 3em;
    display: block;
    position: absolute;
    top: 0;
    left: -4.5em;
    -webkit-transform: skewX(-45deg) translateX(0);
    transform: skewX(-45deg) translateX(0);
    -webkit-transition: none;
    transition: none;
}
    
.lighting {
    webkit-animation: moving 3s ease-in-out infinite;
    -moz-animation: moving 3s ease-in-out infinite;
    -ms-animation: moving 3s ease-in-out infinite;
    -o-animation: moving 3s ease-in-out infinite;
    animation: moving 3s ease-in-out infinite;
   
    }
    
@keyframes moving {  
    30% {  webkit-transform: skewX(-45deg) translateX(33.5em);
    transform: skewX(-45deg) translateX(33.5em);  
}
   
    100% {  webkit-transform: skewX(-45deg) translateX(33.5em);
    transform: skewX(-45deg) translateX(33.5em);   
        
    }
}
</style>