移动端全屏滚动插件 zepto.fullpage.js

模板网 2015-08-10

zepto.fullpage 是专注于移动端的 fullPage.js，依赖 Zepto。

下载地址:https://github.com/yanhaijing/zepto.fullpage

功能概述

 

可实现移动端的单页滚动效果，可自定义参数，提供回调接口，和公开接口。

 

兼容性

 

Ios4+

Andriod2.3+（未全部覆盖）

快速上手

 

HTML

<div class="wp">

    <div class="wp-inner">

        <div class="page page1">1</div>

        <div class="page page2">2</div>

        <div class="page page3">3</div>

        <div class="page page4">4</div>

    </div>

</div>

 

CSS

父容器需是固定高度，并且溢出为隐藏，fullpage会使用父元素的宽度和高度。

 

.wp{

    overflow: hidden;            

}

 

js

一行代码即可完成，如此简单：

 

$('.wp-inner').fullpage();

注意：是在.wp-inner上调用的。

相关文章

  1. JS判断手机访问跳转到手机站使用百度uaredirect.js

    使用了百度SIteApp提供的一个判断手机访客的js代码uaredirect.js，来实现当用户使用手机访问我们的PC站的时候自动跳转到我们的手机站。 用法非常简单： 第一段是引用百度的uaredirect.js，本人还是喜欢将代码保存到本地，代码量也不是很大。 第二段是使用代

  2. JS阻止浏览器返回代码

    一段可以阻止浏览器返回的代码，今天无意打开了一个网站，发现怎么也返回不了，仔细研究了一下网站代码找到了无法返回的原因，于是将这段代码提取出来了。 仅供大家学习交流，请勿使用在自己的网站上，这算是一种比较流氓的行为。

  3. JS判断手机访问函数

    函数is_mobile()手机端返回true，PC端返回false，根据返回值来判断时候是手机端访问，然后做相应的操作。 复制代码 代码如下: script function is_mobile() { var regex_match = /(nokia|iphone|android|motorola|^mot-|softbank|foma|docomo|kddi|up.browse

  4. 阻止浏览器调试的代码

    一段阻止浏览器调试的代码。

  5. JS 文本框默认提示信息点击清空

    JS 文本框默认提示信息点击清空，关键的代码。 复制代码 代码如下: onfocus=if(this.value==this.defaultValue){this.value=;}; onblur=if(this.value==){this.value=this.defaultValue;} type=text 效果截图:

随机推荐

  1. JS判断手机访问跳转到手机站使用百度uaredirect.js

    使用了百度SIteApp提供的一个判断手机访客的js代码uaredirect.js，来实现当用户使用手机访问我们的PC站的时候自动跳转到我们的手机站。 用法非常简单： 第一段是引用百度的uaredirect.js，本人还是喜欢将代码保存到本地，代码量也不是很大。 第二段是使用代

  2. JS阻止浏览器返回代码

    一段可以阻止浏览器返回的代码，今天无意打开了一个网站，发现怎么也返回不了，仔细研究了一下网站代码找到了无法返回的原因，于是将这段代码提取出来了。 仅供大家学习交流，请勿使用在自己的网站上，这算是一种比较流氓的行为。

  3. JS判断手机访问函数

    函数is_mobile()手机端返回true，PC端返回false，根据返回值来判断时候是手机端访问，然后做相应的操作。 复制代码 代码如下: script function is_mobile() { var regex_match = /(nokia|iphone|android|motorola|^mot-|softbank|foma|docomo|kddi|up.browse

  4. 阻止浏览器调试的代码

    一段阻止浏览器调试的代码。

  5. JS 文本框默认提示信息点击清空

    JS 文本框默认提示信息点击清空，关键的代码。 复制代码 代码如下: onfocus=if(this.value==this.defaultValue){this.value=;}; onblur=if(this.value==){this.value=this.defaultValue;} type=text 效果截图: