我使用https://github.com/alvarotrigo/fullPage.js整页滚动,想知道是否有人可以帮助我…
有一个自动播放幻灯片的功能(从一边到另一边),但我不够聪明,不明白如何在一个部分实现这个功能,而不是在第二部分。
在下面的例子中:http://jsfiddle.net/2dhkR/106/我想有第2节-能够做自动幻灯片播放模式,并有第3节没有自动幻灯片播放模式。
<div id="fullpage">
<div class="section">Section 1</div>
<div class="section">Section 2
<div class="slide">Slide 2.1 - should autoslide</div>
<div class="slide">Slide 2.2 - should autoslide</div>
</div>
<div class="section">Section 3
<div class="slide">Slide 3.1 - should not autoslide</div>
<div class="slide">Slide 3.2 - should not autoslide</div>
</div>
</div>
$(document).ready(function () {
$('#fullpage').fullpage({
'slidesColor': ['#AAA', '#FFB', '#0BD'],
'scrollingSpeed': 700,
'anchors': ['first', 'second', 'third', 'forth'],
'controlArrowColor': '#000',
'navigation': true,
'navigationPosition': 'right',
'navigationColor': '#000',
'navigationTooltips': [],
'slidesNavigation': true,
'slidesNavPosition': 'bottom',
'controlArrowColor': '#000',
'loopBottom': true,
'loopTop': false,
'loopHorizontal': true,
'autoScrolling': true,
'scrollOverflow': true,
afterRender: function () {
setInterval(function () {
$.fn.fullpage.moveSlideRight();
}, 2000);
}
});
});
谢谢
您可以在fullpage.js论坛中找到您发布的相同答案:https://github.com/alvarotrigo/fullPage.js/issues/431 issuecomment - 42404270
$(document).ready(function() {
$.fn.fullpage({
slidesColor: ['#1bbc9b', '#4BBFC3', '#7BAABE', 'whitesmoke', '#ccddff'],
loopBottom: true,
afterRender: function(){
idInterval = setInterval(function(){
$.fn.fullpage.moveSlideRight();
}, 2500);
},
afterSlideLoad: function(anchorLink, index, slideAnchor, slideIndex){
if(index == 1 && slideIndex == 1){
clearInterval(idInterval);
}
}
});
});
生活例子