即时工作我需要在jQuery Cycle同时使用Fullpage.js。现在我想要发生的是,如果我点击jCycle导航,会有多个Fullpage会滑动。我的javascript代码是这样的:
$(document).ready(function() {
$('#firstpage').fullpage({
sectionsColor: ['#1bbc9b', '#4BBFC3', '#7BAABE', 'whitesmoke', '#ccddff'],
scrollingSpeed: 1000
});
var titles = ['FirstPage','SecondPage'];
$('#list')
.before('<div id="nav">')
.cycle({
fx: 'scrollRight',
speed: 'fast',
timeout: 0,
pager: '#nav',
pagerAnchorBuilder: function (index) {
return '<a href="#">' + titles[index] + '</a>';
}
});
});
和我的HTML
<div id="list">
<div>
<div id="firstpage">
<div class="section " id="section0">
<img src="imgs/fullPage.png" alt="fullPage" />
</div>
<div class="section" id="section1">
</div>
<div class="section" id="section2">
<div class="intro">
<img src="imgs/example2.png" alt="example" />
</div>
</div>
<div class="section" id="section3">
<div class="intro"></div>
<img src="imgs/tablets.png" alt="tablets" />
</div>
</div>
</div>
<div>
<div id="secondpage">
<div class="section" id="section4">
<img src="imgs/fullPage.png" alt="fullPage" />
</div>
<div class="section" id="section5">
</div>
<div class="section" id="section6">
<img src="imgs/example2.png" alt="example" />
</div>
</div>
</div>
第一页正常工作但是当试图导航第二页时滚动不再有效,但是当我尝试在javascript中添加这样的内容时,在两个页面上滚动都不起作用。
$('#secondpage').fullpage({
sectionsColor: ['#1bbc9b', '#4BBFC3', '#7BAABE', 'whitesmoke', '#ccddff'],
scrollingSpeed: 1000
});
请帮助我们,先谢谢你们。