fullPage 全屏滚动【上下滚动】效果
由于个人能力,研究了两天,终于写出来了。
又花了一天的时间成功的将30多行脚本,改成了70多行,我也是够有心的了。
那么接下来就是我制作这个效果的全部过程。
那一年我十七,她十八,在那个夏天里,我们,,,,,扯远了!
第一就是JQuery没有获得鼠标滚动方向的方法,有一个插件是可以实现的【jQuery Mousewheel Plugin】
,用插件写就没有意思了,于是就NB哄哄的google了一下,写了一个兼容IE/ff等等的时间监听的方法。如下

接下来就是获得鼠标的滚动方向了,话不多说直接上脚本;

其它的脚本写的可能不是最优质的,但是重点突出的是我画红框的那个段脚本;
重点就是,如何将30多行脚本改成70多行。如图:

分解所有的重用脚本为一个函数,理性与尿性的IF嵌套循环判断。
这就是我一个集帅气与智慧的完美作品。 我这么低调不知道是不是会迎来掌声!
fullPage 全屏滚动【上下滚动】效果的更多相关文章
- fullpage 全屏插件
fullpage 全屏插件 全屏滚动效果,原生js也很好实现,主要是用 mousewheel 鼠标滚轮滚动事件, 来判断上滚动还是下滚动,之后设置每次滚动的高度为屏幕的高度即可.但是,虽然效果简单, ...
- JS+CSS实现弹出全屏灰黑色透明遮罩效果的方法
本文实例讲述了js+CSS实现弹出一个全屏灰黑色透明遮罩效果的方法.分享给大家供大家参考.具体分析如下: 在众多的网站都有这样的效果,当进行一定的操作之后,会弹出一个灰黑色的半透明的遮罩,在上面可以操 ...
- 手机端实现fullPage——全屏滚动效果
封装了一个小插件模拟fullPage的全屏滚动效果,比较简单. 特点: 1. 纯js实现,小巧轻便. 2. 兼容性好.苹果.安卓都没问题,暂时没遇到问题机型. 缺点: 1. 仅封装了基础功能,H ...
- fullPage全屏滚动的实现
fullPage.js 是一个基于 jQuery 的插件,它能够很方便.很轻松的制作出全屏网站. 用法: 1.引入jquery 2.引入fullPage 3.每个section代表一屏 4.js启动: ...
- 如何在Android中实现全屏,去掉标题栏效果
在进行Android UI设计时,我们经常需要将屏幕设置成无标题栏或者全屏.要实现起来也非常简单,主要有两种方法:配置xml文件和编写代码设置. 1.在xml文件中进行配置 在项目的清单文件A ...
- jquery.fullpage 全屏滚动
参考文档 :http://www.dowebok.com/77.html 下载地址: https://github.com/alvarotrigo/fullPage.js 1. 使用 HTML < ...
- 杠杠做的全屏随鼠标滚动显示图片,类似于PPT效果
图片有22张,是一张张加载的,耐心点,鼠标一直尝试向下滚就行了. 图片来自<天空之境:乌尤尼盐沼>,一个好美好美的地方 引个流,欢迎去我的博客看看:http://blog.cxycs.co ...
- fullPage全屏高度自适应
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...
- Swiper 移动端全屏轮播图效果
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8&quo ...
随机推荐
- VS2008 查找 替换对话框无法打开的解决方法
1.今天碰到了这个窗口打不开的问题.醉了 解决方案: 窗口->重置窗口布局.
- BZOJ1178 [Apio2009]CONVENTION会议中心
本文作者:ljh2000作者博客:http://www.cnblogs.com/ljh2000-jump/转载请注明出处,侵权必究,保留最终解释权! Description Siruseri政府建造了 ...
- css伪元素研究(::before/::after)
::before/::after和:before/:after实质上效果一样 不过,在 CSS3 中为了区别伪元素和伪类为伪元素使用了双冒号,因此如果使用了 display 或者 width 等属性时 ...
- 关于git的学习
Git是目前世界上最先进的分布式版本控制系统(没有之一)! 由于现在用的还不多,还没有这种体会,但是前人的经验是值得借鉴的,所以我认真的学习了一些关于git的简单操作,现在在这分享一些心得,或者说是为 ...
- Circular Queue Implementation Principle
目录 . 引言 . 环形队列的实现原理 . 环形队列编程实现 . 环形队列的内核实现 1. 引言 环形队列是在实际编程极为有用的数据结构,它有如下特点 . 它是一个首尾相连的FIFO(First In ...
- MVC5-1 ASP.NET的管道流
MVC5 和WebForm的区别 WebForm是一个Page贯穿了一个.CS代码. 1对1 = 耦合在一起 MVC在Controller中将 bihind和page进行了分离. 多对多 = 松耦合 ...
- CentOS加载U盘
概述: 把CentOS设置成了启动进入命令行,结果不知道在哪儿找U盘了,于是搜集了一些命令. 1. 查看分区信息,以确定那个是U盘 使用root执行fdisk -l,确定U盘是sdb1 2. 挂载U盘 ...
- 高可用与负载均衡(8)之聊聊 LVS重要参数和优化以及监控
preface 在明白LVS-DR模式的部署之后,我们看看LVS的几个重要参数: 如有问题,请联系我18500777133@sina.cn [root@localhost ~]# ls /proc/s ...
- python的正则表达式 re-------可以在字符串前加上 r 这个前缀来避免部分疑惑,因为 r 开头的python字符串是 raw 字符串,所以里面的所有字符都不会被转义
正则表达式使用反斜杆(\)来转义特殊字符,使其可以匹配字符本身,而不是指定其他特殊的含义.这可能会和python字面意义上的字符串转义相冲突,这也许有些令人费解.比如,要匹配一个反斜杆本身,你也许要用 ...
- 一种M2M业务的架构及实现M2M业务的方法
http://www.cnblogs.com/coryxie/p/3849764.html 技术领域 [0001] 本发明涉及通信技术领域,尤其涉及一种M2M业务的架构及实现M2M业务的方法. 背景技 ...