仿造fullPage.js https://alvarotrigo.com/fullPage/#firstPage

自己参照网上教程写了一个,加了注释。主要是练习造轮子的能力,需求是不断变化的只拿来用的话谁都会,只有掌握了核心的技术,遇到复杂的需求才不会犯难。以后会按照官网逐渐完善其他功能。欢迎star。

demo:https://hwlv.github.io/myplugin/fullpage/index.html

github:https://github.com/hwlv/myplugin/tree/master/fullpage

使用方法

<script src="js/fullpage.js"></script>
<div id="container" data-PageSwitch="">
<div class="sections">
<div class="section" id="section0">page321</div>
<div class="section" id="section1"></div>
<div class="section" id="section2"></div>
<div class="section" id="section3"></div>
</div>
</div>
   $('#container').PageSwitch({
direction:'vertical',//horizontal,vertical
loop:true,
easing:'ease-in-out',
duration:'700'
});

自己动手写fullPage插件的更多相关文章

  1. 自己动手写Android插件化框架

    自己动手写Android插件化框架 转 http://www.imooc.com/article/details/id/252238   最近在工作中接触到了Android插件内的开发,发现自己这种技 ...

  2. 自己动手写Android插件化框架,让老板对你刮目相看

    欢迎大家前往腾讯云+社区,获取更多腾讯海量技术实践干货哦~ 本文由达文西发表于云+社区专栏 最近在工作中接触到了Android插件内的开发,发现自己这种技术还缺乏最基本的了解,以至于在一些基本问题上浪 ...

  3. 自己动手写jQuery插件---Tip(提示框)

    对jQuery相信很多同学和我一样平时都是拿来主义,没办法,要怪只能怪jQuery太火了,各种插件基本能满足平时的要求.但是这毕竟不是长久之道,古人云:“授之以鱼,不如授之以渔”. 为了方便之前没有接 ...

  4. 自己动手写Vue插件Toast

    <style> .vue-toast { width: 100%; height: 100%; position: fixed; top: 0px; left: 0px; backgrou ...

  5. 自己写jquery插件之模版插件高级篇(一)

    需求场景 最近项目改版中,发现很多地方有这样一个操作(见下图gif动画演示),很多地方都有用到.这里不讨论它的用户体验怎么样. 仅仅是从复用的角度,如果每个页面都去写text和select元素,两个b ...

  6. 自己动手写插件底层篇—基于jquery移动插件实现

    序言 本章作为自己动手写插件的第一篇文章,会尽可能的详细描述一些实现的方式和预备知识的讲解,随着知识点积累的一点点深入,可能到了后期讲解也会有所跳跃.所以,希望知识点不是很扎实的读者或者是初学者,不要 ...

  7. 自己动手写js分享插件 [支持https] (可以分享QQ空间,微信,新浪微博。。。)

    由于百度分享,jiathis 等分享插件在https下均会报错,就萌生了自己动手写一个分享插件的念头,其实实现起来一点都不难,以下代码都已在https网站运行通过,特附上以下代码:还请各位看官不吝赐教 ...

  8. 【原创】自己动手写工具----XSmartNote [Beta 3.0]

    一.前面的话 在动笔之前,一直很纠结到底要不要继续完成这个工具,因为上次给它码代码还是一年多之前的事情,参考自己动手写工具----XSmartNote [Beta 2.0],这篇博文里,很多园友提出了 ...

  9. 自己动手编写vue插件

    一.为什么要自己动手写插件呢,原因有二: 其一:是因为最近产品了提了一个在web端接收,消息通知的需求,产品要求在若干个页面内如果有消息,就要弹出消息弹窗展示给用户,略加思索之后,第一反应就是写个消息 ...

随机推荐

  1. nopCommerce 3.9 大波浪系列 之 开发支持多店的插件

    一.基础介绍 nop支持多店及多语言,本篇结合NivoSlider插件介绍下如何开发支持多商城的小部件. 主要接口如下: ISettingService 接口:设置接口,可实现多店配置. (点击接口介 ...

  2. Charles录制App的接口har文件

    Charles录制App的接口har文件 如果我们想录制我们自己App后台请求接口的信息,并生成har文件,要怎么做呢?其实很简单,就是通过Charles,让手机的访问请求走这个Charles代理就行 ...

  3. RSA简介(一)——数论原理

    RSA是最常用的非对称加密算法. 所谓非对称加密,就是说有两个密钥,一个密钥加密只可以用另外一个密钥解密,一般一个作为公钥,公开给所有人用来加密用,而另一个用来解密其他拥有公钥的加密结果,叫做私钥.另 ...

  4. pygal的简单使用

    pygal的简单使用 例子来自此书: <Python编程从入门到实战>[美]Eric Matthes pygal是一个SVG图表库.SVG是一种矢量图格式.全称Scalable Vecto ...

  5. [补档]暑假集训D6总结

    考试 不是爆零,胜似爆零= = 三道题,就拿了20分,根本没法玩好吧= = 本来以为打了道正解,打了道暴力,加上个特判分,应该不会死的太惨,然而--为啥我只有特判分啊- - 真的是惨. 讲完题觉得题是 ...

  6. Redis主从复制(Master/Slave)

    Redis主从复制(Master/Slave) 修改配置文件 拷贝多个redis.conf文件分别配置如下参数: 开启daemonize yes pidfile port logfile dbfile ...

  7. LFLiveKit架构简介

    LFLiveSession LFLiveSession 是整个sdk的核心,提供对外部的主要接口.主要功能有:管理推流开关.管理音视频录制及渲染.管理录制渲染后的音视频编码.管理编码后的数据上传.管理 ...

  8. 安卓http源码查看器详解

    1.效果图如下,输入网址就可以看到该网址的源码

  9. VMware Workstation Pro 安装centos6.5

    先要安装好VMware Workstation Pro破解版本,下载好centos系统.iso光盘映像文件,本人下载的是CentOS-6.5-i386-bin-DVD1.iso 添加新的虚拟主机可以通 ...

  10. Exceptionless 本地部署踩坑记录

    仅已此文记录 Exceptionless 本地部署所遇到的问题 1.安装ElasticSearch文本 执行elasticsearch目录中的elasticsearch.bat 没有执行成功. 使用命 ...