页面滚动效果库，有点儿皮！

一分钟，让页面滚动更有趣

前段时间刚给大家推荐了一个强大易用的跨平台 CSS3 动画库 Animate.css，内置了很多常用的 CSS 动画，可以一行代码让页面动起来。

今天再推荐它的堂弟，WOW.js，一个有点儿皮的页面滚动效果库。

进入它的官网，就知道这个类库非常有趣了，屏幕上长满了各种各样的狗头。

官网即这个库的介绍和演示页面，当你向下滚动页面时，一个个狗头会以各种不同的动画进行展现。在狗头中间，可以看到这个库的优秀特性，比如简单易用、纯 JS 实现、不依赖 jQuery、动画丰富、只有 3 kb 大小、即时展现等。

WOW.js 基于 Animate.css，能够在页面滚动到某一位置时，触发 Animate.css 的内置动画，从而让页面更加生动。

下面演示一下它的用法，一分钟就能学会！

如何使用

滚动效果的应用场景有很多，比如你要给朋友做一个生日祝福网站，可以先打上老长一段话，当朋友看完这段话，滚动页面到底部的时候，弹出一个生日蛋糕

页面滚动效果库，有点儿皮！相关推荐

html右侧浮动栏随着滚动,jQuery实现div浮动层跟随页面滚动效果
jQuery实现浮动层跟随页面滚动效果 #main{height:2000px} .demo{width:180px; height:250px; margin:10px; border:2px so ...
用jquery实现平滑的页面滚动效果
用jquery实现平滑的页面滚动效果通过几句jquery代码实现页面平滑滚动到某一锚点的效果.实现代码来源于 https://css-tricks.com/snippets/jquery/smoot ...
scrolltop 原生js_解决js页面滚动效果scrollTop在FireFox与Chrome浏览器间的兼容问题的方法...
最近在做博客的目录功能,发现一个在现代浏览器间的一个bug,或是称之为差异,即页面滚动值(scrollTop)的获取与设定. 在此之前先说一下关于页面元素的坐标获取,这张图的经典性不必再提. 实现滚动 ...
滚动条禁止_Axure 教程：不可见滚动条的页面滚动效果
在设计产品原型的过程中,经常会遇到这样的一种场景--所要展示的内容,超出了当前可视页面范围.遇到这种情况,通常使用Axure动态面板的滚动条设置来解决. 产品原型设计是产品经理每日或周期性必须经历的事 ...
labview在2048中添加时间滚动条_Axure 教程：不可见滚动条的页面滚动效果
在设计产品原型的过程中,经常会遇到这样的一种场景--所要展示的内容,超出了当前可视页面范围.遇到这种情况,通常使用Axure动态面板的滚动条设置来解决. 产品原型设计是产品经理每日或周期性必须经历的事 ...
jQuery实现浮动层跟随页面滚动效果
在本例中,我用到了一个重要的插件:scroll-follow,该插件在当前主流浏览器IE6+, FF2+, Safari 3,and Opera 9均测试通过,具有可配置参数,使用简单的特点. XHT ...
html 点击后上下滚动效果,css 上下滚动效果
.scroll{ overflow:hidden; width:100%; } .scrollout{ height:250px; width:100%; overflow:hidden; curso ...
JavaScript实现页面滚动到div区域div以动画方式出现
用JavaScript实现页面滚动效果,以及用wow.js二种方式实现网页滚动效果要实现效果是页面滚动到一块区域,该区域以动画方式出现. 这个效果需要二点: 一:我们要先写好一个css动画. 二:用 ...
列表找房（十）03-页面滚动效果控制——WindowScroller组件用法 Scroll属性
页面滚动效果控制--WindowScroller组件用法 & Scroll属性需求:让List列表的滚动随着window窗口的滚动而滚动 WindowScroller组件用法官网:http ...

页面滚动效果库，有点儿皮！

如何使用

页面滚动效果库，有点儿皮！相关推荐

最新文章

热门文章