fullpage用法

基本用法

<div id="main"> 
    <div class="section section1 ">
        <div id="banner" class="layui-carousel">
            <div carousel-item>
            <div class="banner1 "  >
                <p><span class="glyphicon glyphicon-chevron-down " ></span></p>
            </div>
            <div class="banner2" >
            <p><span class="glyphicon glyphicon-chevron-down" ></span></p>
            </div>
        </div>
    </div>
</div>
<div class="section section2"  data-menuanchor="firstPage">
</div>
<div class="section section3">
<div class="wmlinkimg " >
![](img/wmlink1.png)
</div>
</div>
<div class="section section4"></div>
</div>

$("#main").fullpage({
       //锚点
    anchors:['section1','section2','section3','section4','section5','section6'],
      //先清除所有的动画
    afterLoad:function(anchorLink,index){
        $('.computer').hide();
        $('.computerfan').hide();
        $('.wmlinkimg').hide();
        $('.reapimg').hide();
        $('.myfriendsimg').hide();
        $('.myfriendsimg2').hide();
        $('.computerfan').hide();

        if (index == 2) {
            $('.computer').show().addClass('computermove');
            $('.computerfan').show().addClass('computerfanmove');
        } 
        if (index == 3) {
            $('.wmlinkimg').show().addClass('animated rollIn');
        } 
        if (index == 5) {
            $('.reapimg').show().addClass('animated bounceInLeft');
        } 
        if (index == 7) {
            $('.myfriendsimg').show().addClass('animated bounceInDown');
            $('.myfriendsimg2').show().addClass('animated bounceIn');
        } 
    }
});

js函数

//向下跳一页
$('#banner div div p span').click(function () {
    $.fn.fullpage.moveSectionDown()
})