全屏滚动插件fullPage.js

Demo1   Demo2

fullPage.js在所有的现代浏览器,以及一些旧版浏览器,如Internet Explorer 9,Opera 12等都能兼容。 可兼容支持CSS3的浏览器与非支持CSS3的浏览器,适用于旧版浏览器。 同时,手机、平板电脑和触摸屏电脑还提供触屏支持。


每个代码段定义为包含section类的元素。 第一个代码段作为主页,是默认激活代码。 代码段应进行封装(即<div id="fullpage"> )。 封装不能是body元素。

        <div id="fullpage">
            <div class="section">Some section</div>
            <div class="section">Some section</div>
            <div class="section">Some section</div>
            <div class="section">Some section</div>
        </div>
        

使用jQuery进行初始化

            $(document).ready(function() {
                $('#fullpage').fullpage({
                    //options here
                    autoScrolling:true,
                    scrollHorizontally: true
                });

                //methods
                $.fn.fullpage.setAllowScrolling(false);
            });
            

Thank You.