配置项介绍

一、sectionsColor:

可以为每个section设置background-color属性。示例如下：

<!DOCTYPE html>
<html>
<head lang="en">
 <meta charset="utf-8">
 <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no"/>
 <title>Fullpage简单例子</title>
 <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/fullPage.js/2.9.4/jquery.fullpage.css"/>

 <style type="text/css">
    body{
        color:#fff;/*文字为白色*/
    }
    .slide{
      text-align: center;
      font-size: 20px;
    }
 </style>
</head>

<body>
<div id="fullpage">
 <div class="section"><h1>这是第一屏</h1></div>
 <div class="section">
   <div class="slide">slide1</div>
   <div class="slide">slide2</div>
   <div class="slide">slide3</div>
   <div class="slide">slide4</div>
   <div class="slide">slide5</div>
   <div class="slide">slide6</div>
 </div>
 <div class="section"><h1>这是第三屏</h1></div>
 <div class="section"><h1>这是第四屏</h1></div>
</div>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.0.0/jquery.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/fullPage.js/2.9.4/jquery.fullpage.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/fullPage.js/2.9.4/jquery.fullpage.js"></script>
<!--sectionsColor使用-->
<script>
    $(document).ready(function(){
      $('#fullpage').fullpage({
        sectionsColor:['green','orange','gray','red'],
      });
    });
</script>
</body>
</html>

二、controlArrows:

定义是否通过箭头来控制slide幻灯片，默认为true。当我们设置为false，则幻灯片左右两侧的箭头就会消失，在移动设备上，我们可以通过滑动来操作幻灯片。（在PC端无法观看此效果）

三、verticalCentered:

每一页的内容是否垂直居中，默认为true。一般我们保持默认值。

四、resize:

字体是否随着窗口缩放而缩放，默认为false。

五、scrollingSpeed:

滚动速度，单位为毫秒，默认为700。

六、anchors:

定义锚链接，默认值为[]。有了锚链接，用户就可以快速打开定位到某一页。
注：定义锚链接的时候，值不要和页面中任意的id或name相同，尤其是在IE浏览器下。而且定义时不需要加#。

七、lockAnchors:

是否锁定锚链接，默认为false。如果设置为true，那么定义的锚链接，也就是anchors属性则没有效果。这个配置项使用的比较少。

八、easing:

定义页面section滚动的动画方式，默认为easeInOutCubic，如果修改此项，需要引入jquery.easing插件，或者jqueryUi。
注：动画之间的差异比较小，因此可不用设置。

九、css3:

是否使用css3 transforms来实现滚动效果，默认为true。这个配置项可以提高支持css3的浏览器，比如移动设备等的速度，如果浏览器不支持css3，则会使用jquery来代替css3实现滚动效果。

十、滚动方式

loopTop:滚动到最顶部后是否连续滚动到底部，默认为false。
loopBottom:滚动到最底部后是否连续滚动到顶部，默认为false。
loopHorizontal:横向幻灯片是否循环滚动，默认为true。

十一、autoScrolling:

是否使用插件的滚动方式，默认为true，如果选择false，则会出现浏览器自带的滚动条，将不会按页滚动，而是按照滚动条的默认行为来滚动。

十二、scrollBar:

是否包含滚动条，默认为false，如果设置为true，则浏览器自带的滚动条出现，页面滚动时还是按页滚动，但滚动条的默认行为也有效。

十三、paddingTop/paddingBottom

设置每一个section顶部和底部的padding，默认都为0。一般如果我们需要设置一个固定的在顶部或者底部的菜单、导航、元素等，可以使用者两个配置项。

十四、fixedElements:

固定的元素，默认为null，需要配置一个jquery选择器。在页面滚动的时候，fixedElements设置的元素不动。

十五、keyboardScrolling:

是否可以使用键盘方向键导航，默认为true。

FullPage.js自学笔记（二）