Tilda. Авто-блик кнопки

Добро пожаловать на нашу страницу, где вы узнаете, как создать автоблик кнопки в зеро блоке на платформе Тильда.

В этой статье мы расскажем вам, как добавить эффект автоблика на кнопку в зеро блоке, чтобы привлечь внимание пользователей и повысить взаимодействие с вашим сайтом. Автоблик кнопки может стать мощным инструментом для акцента на важные элементы вашего контента и привлечение внимания посетителей к целевым действиям.
Блик
Авто-блик кнопки
  1. Создаем ZERO блок с кнопкой
  2. Назначаем CSS CLASS NAME для кнопки - t580__btn
  3. Создаем блок T123 для вставки html кода
  4. Вставляем код в блок
<script>
function button1() {
	 /* https://vakas.ru/tilda/effekty-animacii-dlia-knopok-v-tilde/ */
	$('.t-btn').addClass('autoink').append('<div class="ink animate" style="height: 200px;width: 350px;top: -20px;left: -140px;"></div>');
	$('.t-submit').addClass('autoink').append('<div class="ink animate" style="height: 200px;width: 350px;top: -20px;left: -140px;"></div>');
	$('.mybutton').addClass('autoink').append('<div class="ink animate" style="height: 200px;width: 350px;top: -20px;left: -140px;"></div>');
	$('div[data-elem-type="button"] .tn-atom').addClass('autoink').append('<div class="ink animate" style="height: 200px;width: 350px;top: -20px;left: -140px;"></div>');
}

setTimeout(button1, 1000);
setTimeout(button1, 3000);
</script>




<style>
     .autoink{
        position: relative;
        overflow: hidden;
    }
    .ink{
       display: block;
       position: absolute;
       background: rgba(255, 255, 255, 1.0);
       border-radius: 100%;
       -webkit-transform: scale(0);
       -moz-transform: scale(0);
       -o-transform: scale(0);
       transform: scale(0);
       z-index: 20;
    }

    .animate {
    webkit-animation: ripple 4s linear infinite;
    -moz-animation: ripple 4s linear infinite;
    -ms-animation: ripple 4s linear infinite;
    -o-animation: ripple 4s linear infinite;
    animation: ripple 4s linear infinite;
     }
   @keyframes ripple {
    20% {
        opacity: 0;
        transform: scale(2.5);
        }
    100% {
        opacity: 0;
        transform: scale(2.5);
        }
   }
</style>
Если хотите научиться создавать классные сайты на Tilda и стать настоящим профессионалом, приглашаем на курс "Сайты на Tilda".

Наш курс позволяет освоить все навыки, необходимые для создания продающих сайтов, от идеи до финального воплощения. Вы получите полное понимание процессов, начиная с разработки концепции сайта и заканчивая его полноценным запуском. В программу входит изучение уникальных инструментов Tilda. Вы научитесь делать акцент на визуале, грамотно оформлять контент и создавать удобные для пользователей интерфейсы.

Кроме технических аспектов, мы уделяем большое внимание стратегиям продаж и продвижения, чтобы ваш сайт не просто выглядел привлекательно, но и эффективно привлекал клиентов. Завершив обучение, вы будете готовы создавать качественные и конкурентоспособные веб-ресурсы, способные удовлетворить потребности современного бизнеса. Присоединяйтесь к нам и сделайте первый шаг на пути к профессиональному успеху в веб-дизайне!
узнать подробнее
Factor- студия маркетинга и продаж.

Мы за комплексный подход к бизнесу, системность и управляемость. Именно поэтому обычно мы работаем с нашими клиентами в долгую.

Студия "Factor" основана в 2019 году. В нашем штате опытные специалисты готовые помочь вам по всем направлениям маркетинга, продаж и event направления.

Основатель студии Елена Лукьянова - экономист, маркетолог с опытом более 7 лет, руководитель отдела маркетинга в IT-компании, автор курсов школы Factor.
Made on
Tilda