这里集合了几款很棒的制作网页滚动动画的JavaScript库和插件。它们中,有的可以帮助你在页面滚动的时候添加动感的元素动画,有的则是实现目前非常流行的全屏页面切换动画。相信借助这些插件,你也可以让网站变得高大上起来。

ScrollReveal.js

  ScrollReveal.js 用于创建和管理元素进入可视区域时的动画效果,帮助你的网站增加吸引力。只需要给元素增加data-scrollreveal 属性,当元素进入可视区域的时候会自动被触发设置好的动画。

在线演示 立即下载

ScrollMagic

  ScrollMagic 是一款jQuery插件,它让你可以像使用进度条一样使用滚动条。如果你想在特定的滚动位置开始一个动画,并且让动画同步滚动条的动作,或者把元素粘在一个特定的滚动位置,那么这款插件正是你需要的。

在线演示 立即下载

pagePiling.js

  全屏滚动效果是最近非常流行的网页设计形式,带给用户良好的视觉和交互体验。pagePiling.js 这款jQuery插件可以帮助前端开发人员轻松实现这种效果。支持所有的主流浏览器,包括IE8+,支持移动设备。

效果演示 插件下载

WOW.js

  在一些网页上,当你滚动页面的时候会看到各式各样的元素动画效果,非常动感。WOW.js就是一款帮助你实现这种CSS动画效果的插件,很容易定制,你可以改变动画设置喜欢的风格、延迟、长度、偏移和迭代等。

效果演示 立即下载

ScrollMe

  ScrollMe 是一款jQuery插件,用于给网页添加简单的滚动效果。当你向下滚动页面的时候,ScrollMe 可以缩放,旋转和平移页面上的元素。它易于设置,不需要任何自定义的JavaScript代码支持。

在线演示 源码下载

Parallax.js

  Parallax.js是一个简单的,轻量级的的视差引擎,能够对智能设备的方向作出反应。在没有没有陀螺仪或运动检测硬件可用的时候,使用光标的位置来代替。有很多的行为,你就可以设置为任何给定的视差实例。这些行为既可以通过在标记中指定的数据属性或通过构造函数 和JavaScriptAPI 调用。

效果演示 插件下载

原文地址:https://www.cnblogs.com/lhb25/p/page-scrolling-effects-plugins.html

更多相关文章

  1. 记12306货运系统“抢订空车”插件的编写--订车流程梳理
  2. 超全超实用的Javascript类库和jQuery插件大全之一:图片,地图和图形
  3. 高性能JavaScript代码高亮插件
  4. javascript-cropper插件翻译笔记
  5. VS2010常用插件介绍之Javascript插件
  6. jQuery插件:如何将元素引用传递给回调函数?
  7. 动画在画布中移动图像
  8. 可编辑的jquery表格插件
  9. BootStrap3.0学习--JavaScript 插件

随机推荐

  1. 韩顺平_php从入门到精通_视频教程_学习笔
  2. 移动数组PHP中的所有项目
  3. 不正确的日期时间值:“item.purchase dat
  4. 希望为自己构建一个用于PHP + MySQL开发
  5. php图片上传并重命名图片的功能实现原理
  6. php如何以一个对象作为数组下标?
  7. 过期时间为“会话结束”的Cookie何时到期
  8. PHP打开所有报错
  9. php预定义常量目录分隔符
  10. php-自动过滤、自动填充、自动验证