fullPage.js

предварительный просмотр совместимость

English | Español | Pусский | 中文 | 한국어

Available for Vue, React and Angular.

Версия fullPage.js Лицензия Перечисление на PayPal jsDelivr Hits    |   7Кб в формате gzip   |   Создано @imac2

Простая и удобная в использовании библиотека для создания веб-сайтов с полноэкранной прокруткой (также известных, как одностраничные сайты). Она позволяет создавать веб-сайты с полноэкранной прокруткой, а также добавлять горизонтальные ползунки для разделов сайта.

Введение

Более чем приветствуются ваши предложения, касающиеся не только функций и возможностей, но и улучшения стиля кодирования. Давайте вместе создадим замечательную библиотеку, чтобы облегчить жизнь пользователям!

Совместимость

fullPage.js полностью функционирует во всех современных браузерах, также, как и в некоторых устаревших, таких как Internet Explorer 9, Opera 12 и т.д. Работает в браузерах, имеющих и не имеющих поддержку CSS3, что обеспечивает идеальную совместимость с устаревшими браузерами. Обеспечивает поддержку сенсорного управления для мобильных телефонов, планшетов и компьютеров с сенсорным экраном.

Выражаем особую благодарность Browserstack за поддержку fullpage.js.

Лицензия

Коммерческая лицензия

Если вы хотите использовать fullPage для разработки коммерческих сайтов, тем, проектов и приложений, то вам подойдёт коммерческая лицензия. С такой опцией ваш исходный код будет закрытым. Это значит, что вам не придётся менять весь исходный код вашего приложения на лицензию с открытым исходным кодом. [Приобретите Коммерческую лицензию Fullpage здесь]

Лицензия с открытым исходным кодом

Если вы создаёте приложение с открытым исходным кодом по лицензии, совместимой с Лицензией GNU GPL v3, вы можете использовать fullPage на условиях GPLv3.

Сведения об авторе в JavaScript и файлах CSS должны оставаться без изменений (даже после комбинации или минификации)

Прочесть больше о лицензии fullPage.

Использование

Как вы можете увидеть в файлах-примерах, вам необходимо будет включить:

Опционально, при использовании css3:false вы можете добавить библиотеку jQuery UI, в случае если вы хотите использовать другие анимационные эффекты, в дополнение к включённым в библиотеку (easeInOutCubic ).

Установка bower или npm

Опционально, вы можете установить fullPage.js с bower или npm согласно вашим предпочтениям:

Введите:

// С bower
bower install fullpage.js

// С npm
npm install fullpage.js

Включение файлов:

<link rel="stylesheet" type="text/css" href="fullpage.css" />


<!-- Следующая строчка опциональна. Необходима лишь в случае, если вы используете опцию css3:false и хотите использовать другие анимационные эффекты, кроме "linear", "swing" или "easeInOutCubic". -->
<script src="vendors/easings.min.js"></script>

<!-- Следующая строчка опциональна, необходима лишь в случае, если вы хотите использовать опцию `scrollOverflow:true` -->
<script type="text/javascript" src="vendors/scrolloverflow.min.js"></script>

<script type="text/javascript" src="fullpage.js"></script>

Using Webpack, Browserify or Require.js? Check how to use fullPage.js with module loaders.

Опциональное использование CDN

Если вы предпочитаете использовать CDN для загрузки необходимых файлов, fullPage.js есть в CDNJS: https://cdnjs.com/libraries/fullPage.js

Требуемая HTML-структура

Начиная свой документ HTML, обязательно введите HTML DOCTYPE declaration в первой строке вашего HTML-кода. Иначе у вас могут возникнуть проблемы с вертикальным размером разделов. В приведённых примерах используется тип документа HTML 5 <!DOCTYPE html>.

Каждый раздел будет определён элементом, содержащим класс section. Активный раздел по умолчанию будет являться первым разделом, то есть домашней страницей.

Разделы должны помещаться в обёрточный код (в данном случае - <div id="fullpage">). Обёрточный код не может быть элементом body.

<div id="full page">
	<div class="section">Определённый раздел</div>
	<div class="section">Определённый раздел</div>
	<div class="section">Определённый раздел</div>
	<div class="section">Определённый раздел</div>
</div>

Если вы хотите определить другую точку входа (не первый раздел или первый слайд раздела), просто добавьте класс active к разделу и слайду, которые вы хотите загружать в первую очередь.

<div class="section active">Определённый раздел</div>

Чтобы создать горизонтальный ползунок в разделе, каждый слайд должен определяться по умолчанию с помощью элемента, содержащего класс slide:

<div class="section">
	<div class="slide"> Слайд 1 </div>
	<div class="slide"> Слайд 2 </div>
	<div class="slide"> Слайд 3 </div>
	<div class="slide"> Слайд 4 </div>
</div>

Вы можете посмотреть на полностью работоспособный пример HTML-структуры здесь: файл simple.html.

Инициализация

Инициализация с Vanilla Javascript

Всё, что вам нужно сделать, - это указать fullPage.js перед закрывающим тегом </body>.

new fullpage('#fullpage', {
	//options here
	autoScrolling:true,
	scrollHorizontally: true
});

//methods
fullpage_api.setAllowScrolling(false);

Инициализация с jQuery

Если хотите, можете также использовать fullpage.js в качестве плагина jQuery!

$(document).ready(function() {
	$('#fullpage').fullpage({
		//options here
		autoScrolling:true,
		scrollHorizontally: true
	});

	//methods
	$.fn.fullpage.setAllowScrolling(false);
});

Функции и методы можно делать так же, как и с jQuery, как в fullPage.js v2.X.

Пример Vanilla JS со всеми опциями

Более сложная инициализация с установкой всех параметров может выглядеть так:

var myFullpage = new fullpage('#fullpage', {
	//Навигация
	menu: '#menu',
	lockAnchors: false,
	anchors:['firstPage', 'secondPage'],
	navigation: false,
	navigationPosition: 'right',
	navigationTooltips: ['firstSlide', 'secondSlide'],
	showActiveTooltip: false,
	slidesNavigation: false,
	slidesNavPosition: 'bottom',

	//Скроллинг
	css3: true,
	scrollingSpeed: 700,
	autoScrolling: true,
	fitToSection: true,
	fitToSectionDelay: 1000,
	scrollBar: false,
	easing: 'easeInOutCubic',
	easingcss3: 'ease',
	loopBottom: false,
	loopTop: false,
	loopHorizontal: true,
	continuousVertical: false,
	continuousHorizontal: false,
	scrollHorizontally: false,
	interlockedSlides: false,
	dragAndMove: false,
	offsetSections: false,
	resetSliders: false,
	fadingEffect: false,
	normalScrollElements: '#element1, .element2',
	scrollOverflow: false,
	scrollOverflowReset: false,
	scrollOverflowOptions: null,
	touchSensitivity: 15,
	bigSectionsDestination: null,

	//Доступ
	keyboardScrolling: true,
	animateAnchor: true,
	recordHistory: true,

	//Дизайн
	controlArrows: true,
	verticalCentered: true,
	sectionsColor : ['#ccc', '#fff'],
	paddingTop: '3em',
	paddingBottom: '10px',
	fixedElements: '#header, .footer',
	responsiveWidth: 0,
	responsiveHeight: 0,
	responsiveSlides: false,
	parallax: false,
	parallaxOptions: {type: 'reveal', percentage: 62, property: 'translate'},
	cards: false,
	cardsOptions: {perspective: 100, fadeContent: true, fadeBackground: true},

	//Настроить селекторы
	sectionSelector: '.section',
	slideSelector: '.slide',

	lazyLoading: true,

	//события
	onLeave: function(origin, destination, direction){},
	afterLoad: function(origin, destination, direction){},
	afterRender: function(){},
	afterResize: function(width, height){},
	afterReBuild: function(){},
	afterResponsive: function(isResponsive){},
	afterSlideLoad: function(section, origin, destination, direction){},
	onSlideLeave: function(section, origin, destination, direction){}
});

Создание ссылок на разделы или слайды

Если вы используете fullPage.js с ссылками привязки для разделов (пользуясь опцией anchors или атрибутом data-anchor в каждом разделе), то вы сможете использовать ссылки привязки также для перемещения напрямую к определённому слайду в разделе.

Вот пример ссылки с привязкой: http://alvarotrigo.com/fullPage/#secondPage/2 (это URL, который вы увидите при доступе к данному разделу/слайду вручную) Обратите внимание на то, что последняя часть URL заканчивается элементом #secondPage/2.

При следующей инициализации:

new fullpage('#fullpage', {
	anchors:['firstPage', 'secondPage', 'thirdPage']
});

Привязка #secondPage/2 в конце URL определяет заданный раздел и слайд соответственно. В предыдущем URL заданным разделом будет являться раздел, определённый привязкой secondPage, а заданным слайдом будет второй слайд, так как для этого мы и использовали индекс 2. (первый слайд в разделе имеет индекс 0, так как технически это раздел).

Мы могли бы использовать свою привязку для слайда, а не его индекс, если бы мы использовали атрибут data-anchor в HTML-разметке следующим образом:

<div class="section">
	<div class="slide" data-anchor="slide1"> Слайд 1 </div>
	<div class="slide" data-anchor="slide2"> Слайд 2 </div>
	<div class="slide" data-anchor="slide3"> Слайд 3 </div>
	<div class="slide" data-anchor="slide4"> Слайд 4 </div>
</div>

В данном случае мы бы использовали URL #secondPage/slide3, являющийся эквивалентным предыдущему - #secondPage/2.

Обратите внимание, что привязки к разделам могут создаваться точно также, с помощью атрибута data-anchor, если не предусмотрен ряд каких-либо привязок - anchors.

Внимание! обозначения data-anchor не могут иметь значение, совпадающее с каким-либо элементом ID на сайте (или элементом NAME - для IE).

Создание больших и малых разделов

Демо fullPage.js обеспечивает возможность убрать ограничение по высоте разделов и слайдов. Есть возможность создавать разделы, высота которых больше или меньше окна просмотра. Эта функция идеальна при использовании колонтитулов. Важно понимать, что нет смысла в применении данной функции ко всем вашим разделам. При наличии более чем одного раздела при первоначальной загрузке сайта fullPage.js не сможет сделать прокрутку, чтобы увидеть следующий раздел, так как он уже и так будет находиться в окне просмотра.

Для создания меньших разделов просто используйте класс fp-auto-height в разделе, к которому хотите применить эту функцию. Тогда высота будет определяться контентом вашего раздела/слайда.

<div class="section">Полное окно просмотра</div>
<div class="section fp-auto-height">Автовысота</div>

Разделы с подстройкой автовысоты

Демо Подстройка автовысоты может быть применена с помощью класса fp-auto-height-responsive. В таком случае разделы будут отображаться в полную высоту, пока не будет активирован режим подстройки.

Классы состояний, добавляемые fullpage.js

Fullpage.js добавляет различные классы к разным элементам, чтобы отслеживать статус сайта:

Отложенная загрузка

Демо fullPage.js обеспечивает возможность отложенной загрузки изображений, видео- и аудиоэлементов, чтобы они не замедляли загрузку вашего сайта и не тратили без необходимости трафик при передаче данных. При использовании отложенной загрузки все эти элементы будут загружаться только при открытии в окне конструирования. Всё, что вам нужно сделать для активации отложенной загрузки, - это изменить ваш атрибут src на data-src, как показано ниже:

<img data-src="image.png">
<video>
	<source data-src="video.webm" type="video/webm" />
	<source data-src="video.mp4" type="video/mp4" />
</video>

Если вы уже применяете другой способ для отложенной загрузки, который также использует data-src, вы можете отключить отложенную загрузку fullPage.js, установив опцию lazyLoading: false.

Автопроигрывание/приостановка встроенного медиа

Демо Примечание: функция автопроигрывания может не работать на некоторых мобильных устройствах, в зависимости от их ОС и браузера (то есть, в Safari в iOS, в версиях до 10.0).

Проигрывание при загрузке раздела/слайда:

При использовании атрибута autoplay для видео или аудио, или параметра autoplay=1 для встроенных фреймов youtube, медиа будет проигрываться при загрузке страницы. Для проигрывания медиа при загрузке раздела/слайда, используйте data-autoplay. Например:

<audio data-autoplay>
	<source src="http://metakoncept.hr/horse.ogg" type="audio/ogg">
</audio>

Приостановка при покидании страницы

Встроенные фреймы HTML5 <video> / <audio> и Youtube автоматически останавливаются, когда вы покидаете раздел или слайд. Это можно отключить с помощью атрибута data-keepplaying. Например:

<audio data-keepplaying>
	<source src="http://metakoncept.hr/horse.ogg" type="audio/ogg">
</audio>

Использование расширений

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

Для расширений вам требуется использовать минифицированный файл fullpage.extensions.min.js, находящийся в папке dist, а не обычный файл fullPage.js (fullpage.js или fullpage.min.js).

После приобретения файла расширения вам нужно будет добавить его перед fullPage. Например, если я хочу использовать расширение Continuos Horizontal, мне нужно будет включить файл расширения, а затем – версию файла fullPage для расширений.

<script type="text/javascript" src="fullpage.continuousHorizontal.min.js"></script>
<script type="text/javascript" src="fullpage/fullpage.extensions.min.js"></script>

Ключ активации и ключ лицензии потребуются для каждого расширения. Узнайте более подробно об этом здесь.

Затем вы сможете использовать и настраивать их, как разъясняется в разделе опции.

Опции

new fullpage({
    licenseKey: 'YOUR_KEY_HERE'
});

Важно Нужно понимать, что значения в ряду опций anchors напрямую соотносятся с элементом класса .section при помощи их местоположения в разметке.

```javascript
new fullpage('#fullpage', {
	anchors: ['firstPage', 'secondPage', 'thirdPage', 'fourthPage', 'lastPage'],
	menu: '#myMenu'
});

Внимание: элемент меню должен помещаться за пределами обёрточного кода для полного экрана во избежание проблем при использовании css3:true. В противном случае он будет присоединён к body самим плагином.

<script type="text/javascript" src="vendors/scrolloverflow.min.js"></script>
<script type="text/javascript" src="fullpage.js"></script>

Чтобы предотвратить создание fullpage.js полосы прокрутки в определённых разделах или слайдах, используйте класс fp-noscroll. Например: <div class="section fp-noscroll">

Вы можете избежать применения scrolloverflow в отзывчивом режиме, используя fp-auto-height-responsive в элементе раздела.

Функции

Можете увидеть их в действии здесь

getActiveSection()

Демо Даёт объект (наберите Section), содержащий активный слайд и его свойства.

fullpage_api.getActiveSection();

getActiveSlide()

Демо Даёт объект (наберите Slide), содержащий активный раздел и его свойства.

fullpage_api.getActiveSlide();

moveSectionUp()

Демо Прокручивает на один раздел вверх:

fullpage_api.moveSectionUp();

moveSectionDown()

Демо Прокручивает на один раздел вниз:

fullpage_api.moveSectionDown();

moveTo(раздел, слайд)

Демо Прокручивает страницу к заданному разделу и слайду. Первый слайд, отображающийся по умолчанию, будет иметь индекс 0.

/*Прокручивание к разделу с ссылкой с привязкой `firstSlide` и ко 2-му слайду */
fullpage_api.moveTo('firstSlide', 2);


//Прокручивание к 3-му разделу на сайте
fullpage_api.moveTo(3, 0);

//То же самое, что и
fullpage_api.moveTo(3);

silentMoveTo(раздел, слайд)

Демо Абсолютно то же самое, что и moveTo, но в этом случае функция выполняет прокрутку без анимации. Прямой переход к заданной точке.

/*Прокручивание к разделу с ссылкой с привязкой `firstSlide` и ко 2-му слайду */
fullpage_api.silentMoveTo('firstSlide', 2);

moveSlideRight()

Демо Прокручивает горизонтальный ползунок текущего раздела к следующему слайду:

fullpage_api.moveSlideRight();

moveSlideLeft()

Демо Прокручивает горизонтальный ползунок текущего раздела к предыдущему слайду:

fullpage_api.moveSlideLeft();

setAutoScrolling(логическая операция)

Демо Устанавливает конфигурацию скроллинга в режиме реального времени. Определяет поведение прокрутки страницы. При установке значения true будет использоваться “автоматический” скроллинг, в противном случае будет применяться “стандартная” прокрутка сайта или прокрутка “вручную”.

fullpage_api.setAutoScrolling(false);

setFitToSection(логическая операция)

Демо Устанавливает значение для опции fitToSection, определяющей, подстраивать ли раздел под экран.

fullpage_api.setFitToSection(false);

fitToSection()

Демо Прокручивает к ближайшему активному разделу, подстраивая его под окно просмотра.

fullpage_api.fitToSection();

setLockAnchors(логическая операция)

Демо Устанавливает значение для опции lockAnchors, определяющей, будут ли привязки отражаться в URL.

fullpage_api.setLockAnchors(false);

setAllowScrolling(логическая операция, [направления])

Демо Даёт или убирает возможность скроллинга разделов/слайдов с помощью колеса мыши/трекпада или сенсорных жестов(включено по умолчанию). Обратите внимание, что функция не деактивирует скроллинг с помощью клавиатуры. Для этого вам потребуется использовать setKeyboardScrolling.


//деактивация прокрутки
fullpage_api.setAllowScrolling(false);

//деактивация прокрутки вниз
fullpage_api.setAllowScrolling(false, 'down');

// деактивация прокрутки вниз и вправо
fullpage_api.setAllowScrolling(false, 'down, right');

setKeyboardScrolling(логическая операция, [направления])

Демо Даёт или убирает возможность скроллинга разделов с помощью клавиатуры (включено по умолчанию).

// деактивация всей прокрутки с помощью клавиатуры fullpage_api.setKeyboardScrolling(false);

// деактивация прокрутки вниз с помощью клавиатуры
fullpage_api.setKeyboardScrolling(false, 'down');

//деактивация прокрутки вниз и вправо с помощью клавиатуры fullpage_api.setKeyboardScrolling(false, 'down, right');

setRecordHistory(логическая операция)

Демо Определяет, записывать ли историю для каждого изменения hash в URL.

fullpage_api.setRecordHistory(false);

setScrollingSpeed(миллисекунды)

Демо Определяет скорость прокрутки в миллисекундах.

fullpage_api.setScrollingSpeed(700);

destroy(тип)

Демо Разрушает события плагина и, опционально, его HTML-разметку и стили. Идеальна при использовании AJAX для загрузки контента.

//разрушение всех событий Javascript, созданных fullPage.js (прокручивания, изменения hash в URL...)
fullpage_api.destroy();

// разрушение всех событий Javascript и любых модификаций, произведённых fullPage.js поверх вашей оригинальной HTML-разметки.
fullpage_api.destroy('all');

reBuild()

Обновляет DOM-структуру для подстройки под новый размер окна или его содержимого. Идеальна для использования в комбинации с вызовами AJAX или внешними изменениями в DOM-структуре сайта, особенно при применении scrollOverflow:true.

fullpage_api.reBuild();

setResponsive(логическая операция)

Демо Устанавливает отзывчивый режима на странице. При установке хначения true автопрокрутка будет отключена, результат будет тем же самым, как при активации опций responsiveWidth или responsiveHeight.

fullpage_api.setResponsive(true);

responsiveSlides.toSections()

Расширение fullpage.js. Необходима версия fullpage.js >= 3.0.1. Трансформирует горизонтальные слайды в вертикальные разделы.

fullpage_api.responsiveSlides.toSections();

responsiveSlides.toSlides()

Расширение fullpage.js. Необходима версия fullpage.js >= 3.0.1. Трансформирует оригинальные слайды (теперь трансформированные в вертикальные разделы) обратно в горизонтальные слайды.

fullpage_api.responsiveSlides.toSlides();

Обратные вызовы

Демо Можете увидеть их в действии здесь.

Некоторые обратные вызовы, такие как onLeave, будут содержать тип параметров Section или Slide. Эти объекты будут содержать следующие свойства:

afterLoad (origin, destination, direction)

Обратный вызов активируется после загрузки разделов и завершения прокрутки. Параметры:

Пример:

new fullpage('#fullpage', {
	anchors: ['firstPage', 'secondPage', 'thirdPage', 'fourthPage', 'lastPage'],

	afterLoad: function(origin){
		var loadedSection = this;

		//использование индекса
		if(origin.index == 2){
			alert("Section 3 ended loading");
		}

		//использование ссылки с привязкой
		if(origin.anchor == 'secondSlide'){
			alert("Section 2 ended loading");
		}
	}
});

onLeave (index, nextIndex, direction)

Этот обратный вызов активируется, когда пользователь покидает раздел, при переходе к новому разделу. Возврат false отменит переход до его осуществления.

Параметры:

Пример:

new fullpage('#fullpage', {
	onLeave: function(origin, destination, direction){
		var leavingSection = this;

		//после покидания раздела 2
		if(origin.index == 1 && direction =='down'){
			alert("Going to section 3!");
		}

		else if(origin.index == 1 && direction == 'up'){
			alert("Going to section 1!");
		}
	}
});

Отмена прокрутки до её осуществления

Вы можете отменить прокрутку, установив возврат false на обратном вызове onLeave:

new fullpage('#fullpage', {
	onLeave: function(origin, destination, direction){
		//прокрутка не будет осуществлена, если заданный раздел – раздел 3
		if(destination.index == 2){
			return false;
		}
	}
});

afterRender()

Этот обратный вызов активируется сразу после того, как создаётся структура страницы. Данный обратный вызов вы можете использовать для инициализации других плагинов или активации любого кода, для чего требуется готовый документ (так как плагин изменяет DOM для создания финальной структуры). Более подробную информацию вы найдёте в разделе Часто задаваемые вопросы.

Пример:

new fullpage('#fullpage', {
	afterRender: function(){
		var pluginContainer = this;
		alert("Финальная DOM-структура готова");
	}
});

afterResize()

Этот обратный вызов активируется после изменения размера окна браузера. Сразу после изменения размера разделов.

Параметры:

Пример:

new fullpage('#fullpage', {
	afterResize: function(width, height){
		var pluginContainer = this;
		alert("Завершено изменение размера разделов");
	}
});

afterReBuild()

This callback is fired after manually re-building fullpage.js by calling fullpage_api.reBuild().

Example:

new fullpage('#fullpage', {
	afterReBuild: function(){
		console.log("fullPage.js has manually being re-builded");
	}
});

afterResponsive(isResponsive)

Этот обратный вызов активируется после того, как fullpage.js переходит из стандартного режима в отзывчивый режим или из отзывчивого в стандартный.

Параметры:

Пример:

new fullpage('#fullpage', {
	afterResponsive: function(isResponsive){
		alert("Is responsive: " + isResponsive);
	}
});

afterSlideLoad (section, origin, destination, direction)

Обратный вызов активируется после загрузки слайда раздела и окончания прокрутки.

Параметры:

Пример:

new fullpage('#fullpage', {
	anchors: ['firstPage', 'secondPage', 'thirdPage', 'fourthPage', 'lastPage'],

	afterSlideLoad: function( section, origin, destination, direction){
		var loadedSlide = this;

		//первый слайд второго раздела
		if(section.anchor == 'secondPage' && destination.index == 1){
			alert("Первый слайд загружен");
		}

		//второй слайд второго раздела (supposing #secondSlide is the
		//привязка для второго раздела
		if(section.index == 1 && destination.anchor == 'secondSlide'){
			alert("Второй слайд загружен");
		}
	}
});

onSlideLeave (section, origin, destination, direction)

Этот обратный вызов активируется после того, как пользователь покидает слайд для перехода к другому, при переходе к новому слайду. Возврат false отменит переход до его осуществления.

Параметр:

Пример:

new fullpage('#fullpage', {
	onSlideLeave: function( section, origin, destination, direction){
		var leavingSlide = this;

		//переход от первого слайда 2го раздела вправо
		if(section.index == 1 && origin.index == 0 && direction == 'right'){
			alert("Покидание первого слайда!!");
		}

		// переход от 3го слайда 2го раздела влево
               if(section.index == 1 && origin.index == 2 && direction == 'left'){
			alert("Переход к слайду 2! ");
		}
	}
});

Отмена перехода до его осуществления

Вы можете отменить переход с помощью возврата false на обратном вызове onSlideLeave. То же самое, что и при отмене перехода с помощью onLeave.

Сообщение о проблемах

  1. Пожалуйста, перед вопросом поищите свою проблему с помощью поиска github issues.
  2. Убедитесь, что используете последнюю версию fullpage.js. Техподдержка не работает со старыми версиями.
  3. Воспользуйтесь форумом Github Issues, чтобы задать вопрос.
  4. Потребуется отдельное воспроизведение проблемы. По возможности используйте для этого jsfiddle или codepen.

Внесение предложений для fullpage.js

Пожалуйста, прочтите Contributing to fullpage.js

Changelog

Чтобы посмотреть список последних изменений, пожалуйста, обратитесь к разделу Релизы.

Задачи по построению

Желаете построить дистрибутивные файлы fullpage.js? Пожалуйста, зайдите в раздел Задачи по построению

Ресурсы

Кто пользуется fullPage.js

Если вы хотите, чтобы ваша страница была указана в этом списке, пожалуйста, свяжитесь со мной и пришлите URL.

Google Coca-cola eBay BBC Sony

Vodafone British Airways McDonalds EA Vogue Mi

Mercedes sym Bugatti eDarling Ubisoft

Вы можете найти ещё один список здесь.

Денежные переводы

Денежные переводы более чем приветствуются :)

Patreon page

Перевести деньги

Sponsors

Become a sponsor and get your logo on our README on Github with a link to your site. [Become a sponsor] | [Become a patreon]

Stackpath Browserstack CodePen CodeFirst

People