Главная > Javascript > fullpage js scroll inside section

fullpage js scroll inside section

Для вертикальной прокрутки внутри блоков, созданных с использованием fullPage, использовать параметр:

scrollOverflow:true,

Полный пример:

$(document).ready(function(){
	$('#fullpage').fullpage({
		anchors:['section-0','section-1','section-2'],
		menu:'#navigation',
		verticalCentered:false,
		scrollOverflow:true,
		afterLoad:function(anchorLink,index){
			if(anchorLink=='section-0'){
				$('#navigation').hide();
			}
			else{
				$('#navigation').show();
			}
		},
	});
});
<ul id="navigation">
	<li data-menuanchor="section-1"><a href="#section-1">Section 1</a></li>
	<li data-menuanchor="section-2"><a href="#section-2">Section 2</a></li>
</ul>
<div id="fullpage">
	<div data-anchor="section-0" class="section section-0"></div>
	<div data-anchor="section-1" class="section section-1"></div>
	<div data-anchor="section-2" class="section section-2"></div>
</div>
.section-0{
	background:red;
}
.section-1{
	background:green;
}
.section-2{
	background:blue;
}
#navigation{
	position:fixed;
	top:100px;
	left:20px;
	z-index:100;
}
#navigation li.active a{
	color:red;
}

http://alvarotrigo.com/fullPage/
https://github.com/alvarotrigo/fullPage.js

Categories: Javascript Tags:
  1. Пока что нет комментариев.
Похожие публикации