会员登录注册入口
帐  号:
密  码:
  保持登录 忘记密码?
主页 > 特效插件 > 滚动插件 >

fullPage.js-简单易用的jQuery全屏滚动插件

2016-01-03   适用版本:未知  所属类目:滚动插件
价格:¥0  人气:154
不知大家有没有见到过安装浏览器新版本时弹出的新版介绍页面,比如猎豹浏览器新版本介绍,每个页面都能全屏展示,信息展示非常直接,交互效果顺滑,应用范围非常广泛,功能不多废话,大家看演示即可,有需要的朋友可以收藏一下。
献上几个截图:


 
使用方法:
引入文件:
<link rel="stylesheet" href="css/jquery.fullPage.css">
<script src="js/jquery.min.js"></script>

<!-- jquery.easings.min.js 是必须的,用于 easing 参数,也可以使用完整的 jQuery UI 代替 -->
<script src="js/jquery.easings.min.js"></script>

<!-- 如果 scrollOverflow 设置为 true,则需要引入 jquery.slimscroll.min.js,一般情况下不需要 -->
<script src="js/jquery.slimscroll.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 class="slide">第三屏的第一屏</div>
        <div class="slide">第三屏的第二屏</div>
        <div class="slide">第三屏的第三屏</div>
        <div class="slide">第三屏的第四屏</div>
    </div>
    <div class="section">第四屏</div>
</div>

调用js方法:
$(function(){
    $('#fullpage').fullpage();
});

另外插件也提供了丰富的API和回调函数,这里是官方介绍:https://github.com/alvarotrigo/fullPage.js
去淘宝购买

相关插件

登录 后才能参加讨论~