基于jQuery插件，做全屏网站fullpage

FullPage插件

• 基于 jQuery 的插件，它能够帮你很方便、很轻松的制作出全屏网站。
• 支持鼠标滚动，支持前进后退和键盘控制，多个回调函数，
  支持手机、平板触摸事件，支持 CSS3 动画，支持窗口缩放，窗口缩放时自动调整，
  可设置滚动宽度、背景颜色、滚动速度、循环选项、回调、文本对齐方式等等。
  引用文件

    <link rel="stylesheet" href="css/jquery.fullPage.css">
    <script src="js/jquery.min.js"></script>
    <script src="js/jquery.fullPage.js"></script>

html结构

<div id="fullpage">
    <div class="section">第一屏</div>
    <div class="section">第二屏</div>
    <div class="section">第三屏</div>
    <div class="section">第四屏</div>
</div>

初始化

$(function(){
    $('#fullpage').fullpage();
});

每个 section 代表一屏，默认显示“第一屏”，如果要指定加载页面时显示的“屏幕”，可以在对应的 section 加上 class=”active”
了解详情点击进入官网
fullpage.js官网