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