Т И Л Ь Д О Ш Н А Я

Проиграть анимацию

Imagine
your ads managed
themselves

Automate all your ad management strategies for Facebook and Google Ads in a single interface.

Просим обратить внимание: техническая поддержка Tilda Publishing не осуществляет поддержку связанную с работой кода

1) Справа сверху выставляем желаемые настройки:
Вход — откуда будет начинаться анимация;
Выход — откуда анимация будет появляться, при переходе на другую страницу;
Скорость — скорость анимации;
Количество — количество слоев;
Easing — плавность анимации;
Откючить_Анимацию_При_Выходе — отключает анимацию выхода с страницы. Эта настройка не отображается в демонстрации, но будет работать у вас на сайте.
Так-же, в вкладке "Цвета" можно изменить цвет каждого отдельного слоя эффекта.

2) Снизу на странице скопируйте код и вставьте его в блок Т123. Вы можете вставить этот блок в шапку, чтобы добавить эффект сразу на все страницы.

Важно: разместите этот блок на самом верху страницы.

Эффект загрузки страницы

Работает как стандартный блок Т228, но с другим эффектом. При входе на страницу, закрывает контент до момента её загрузки, после чего уходит в выбранную сторону. Дальше, при переходе по ссылке, контент закрывается, происходит загрузка и показывается другая страница.

Инструкция

Код:

<style>.preloader{height:100vh; width:100vw; position:fixed; top:0; left:0; z-index:9910; -webkit-transition: all 1s; -o-transition: all 1s; transition: all 1s; -webkit-transition-timing-function: ease-in-out; -o-transition-timing-function: ease-in-out; transition-timing-function: ease-in-out;}.preloader1{background-color:#FF4732;z-index:9909}.preloader2{background-color:#FF5240;z-index:9908}.preloader3{background-color:#FF5E4C;z-index:9907}.preloader_out_top_prepare {top: -100vh;transition: none !important;}.preloader_in_top {top: -100vh}.preloader_out_bottom_prepare {top: 100vh;transition: none !important;}.preloader_in_bottom {top: 100vh}.preloader_out_left_prepare {left: -100vw;transition: none !important;}.preloader_in_left {left: -100vw}.preloader_out_right_prepare {left: 100vw;transition: none !important;}.preloader_in_right {left: 100vw}</style><div class='preloader preloader1'></div><div class='preloader preloader2'></div><div class='preloader preloader3'></div><script>$('document').ready(function(){setTimeout(function(){$('.preloader1').addClass('preloader_in_top');}, 100);setTimeout(function(){$('.preloader2').addClass('preloader_in_top');}, 200);setTimeout(function(){$('.preloader3').addClass('preloader_in_top');}, 300);$('button:not(.t-submit):not(.t835__btn_next):not(.t835__btn_prev):not(.t835__btn_result):not(.t862__btn_next):not(.t862__btn_prev):not(.t862__btn_result):not(.t854__news-btn):not(.t862__btn_next), a:not([href*=#],.carousel-control,.t-carousel__control,.t807__btn_reply,[href^=#price],[href^=javascript],[href^=mailto],[href^=tel],[href^=link_sub])').click(function(e){var goTo = this.getAttribute('href');if (goTo && goTo.substring(0,4) == 'tel:' ) {return true;}var target = $(this).attr('target');if (target !== '_blank' ) {e.preventDefault();setTimeout(function () {$('.preloader4').removeClass('preloader_in_top'); $('.preloader4').addClass('preloader_in_bottom_prepare'); setTimeout(function(){ $('.preloader4').removeClass('preloader_in_bottom_prepare');}, 50);}, 100);setTimeout(function () {$('.preloader3').removeClass('preloader_in_top'); $('.preloader3').addClass('preloader_in_bottom_prepare'); setTimeout(function(){ $('.preloader3').removeClass('preloader_in_bottom_prepare');}, 50);}, 200);setTimeout(function () {$('.preloader2').removeClass('preloader_in_top'); $('.preloader2').addClass('preloader_in_bottom_prepare'); setTimeout(function(){ $('.preloader2').removeClass('preloader_in_bottom_prepare');}, 50);}, 300);setTimeout(function () {$('.preloader1').removeClass('preloader_in_top'); $('.preloader1').addClass('preloader_in_bottom_prepare'); setTimeout(function(){ $('.preloader1').removeClass('preloader_in_bottom_prepare');}, 50);}, 400);setTimeout(function(){ window.location = goTo;},1700);}});});</script>