Вертикальный скролл инструкция

Вертикальный скрол

1) Создаем блоки, которые мы будем использовать в вертикальном скролле.

2) Добавляем в конце страницы блок Другое -> T123 HTML-код и вставляем в него код, который находится ниже.

3) В коде есть несколько отметок, где нужно ввести данные своих блоков или настройки для скролла. Они выглядят вот так:
/*************************************************/
/*******************Часть 1***********************/
/*************************************************/

3.1) В части 1 нам нужно указать id всех блоков, которые будут отображаться.
var sections = $("#rec109090577, #rec109090584, #rec109090585, #rec109090586");

4) Если у вас на сайте внизу есть плашка Made On Tilda, в части 2 нужно добавить этот код. В противном случае, ваш аккаунт могут забанить.
setTimeout(function(){ if ($("div").last().parent().parent().parent().attr("id").length == 9) { $("div").last().parent().parent().parent().wrap("<div class='section fp-section'></div>").parent().appendTo("#fullpage").addClass("section") } }, 3000)

5) В части 3 можно указать дополнительные настройки:

// Скорость скролла
scrollingSpeed: 600,

// Анимация
// Можно заменить "easeInOutCubic" на любую другую анимацию. Список анимаций вы можете найти тут:
// https://easings.net/ru
easing: "easeInOutCubic",

// Управление клавиатурой
keyboardScrolling: true,

// Стрекли управления на горизонтальном скролле
controlArrows: true,

// Скролл с последнего экрана переводит на первый экран
loopBottom: true,

// Скролл с последнего экрана переводит на первый экран
loopTop: true,

// Якорные ссылки на страницу.
// Вы можете на любом экране добавить кнопку, с ссылкой #About, при нажатии на неё пользователь попадет на экран, который отмечен как About.
// Так-же, можно скопировать ссылку mysite.com/#about и при переходе на неё, пользователь попадет сразу на экран About.
anchors:['Intro', 'About', 'Shop', 'Contacts'],

<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/fullPage.js/2.9.7/jquery.fullpage.min.css" />
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/fullPage.js/2.9.7/vendors/jquery.easings.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/fullPage.js/2.9.7/jquery.fullpage.extensions.min.js"></script>
<script>
$(document).ready(function() {
	/*********************************************/
	/*****************ЧАСТЬ 1*********************/
	/*********************************************/
	// Указываем id блоков
	var sections = $("#rec106962189, #rec106962736, #rec106964636, #rec106962218");

	sections.wrap("<div class='section'></div>");
	$(".section").wrapAll("<div id='fullpage'></div>");

	/*********************************************/
	/*****************ЧАСТЬ 2*********************/
	/*********************************************/
	
	
	window.page = $('#fullpage').fullpage({
		/*********************************************/
		/*****************ЧАСТЬ 3*********************/
		/*********************************************/


		// Эту часть не трогаем
		css3: true,
		scrollBar: true,
	});
});
</script>
<style>
	body {
		overflow: hidden !important;
	}
</style>