返回列表 发新帖

前端页面滑动滚动 加载动画库 Scrollanim 手机加载动画组件

[复制链接]
灌水成绩
806
主题
826
帖子
5313
积分
等级头衔
积分成就
  • 威望: 0
  • 贡献: 4487
  • 金钱: 0
  • 违规:
  • 在线时间:280 小时
  • 注册时间:2019-3-9
  • 最后登录:2019-11-15
个人勋章

官方

联系方式
QQ
发表于 2019-10-25 22:06:05 | 显示全部楼层 | 阅读模式

马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。

您需要 登录 才可以下载或查看,没有帐号?注册

x
Scrollanim 一款简单而又强大的 滚动加载动画库
Scrollanim 是使用 CSS3 + JavaScript 实现的用于创建滚动动画的库,应用到元素上后,当此元素出现在浏览器可视区域时便会执行对应的动画。Scrollanim 是 Kissui 的一部分,所以使用 Scrollanim 时需要用到 kissui.css。



使用方法也和简单 下载后引入下面几个文件就可以了
  1. <link rel=“Sheet”href=“css/kassii.css”>
复制代码
  1. <link rel=" sheet" href="css/scrollanim.min.css">
复制代码
  1. <script src="js/scrollanim.min.js">script>
复制代码
  1. "fadeIn">hello world!div>
复制代码

关于Scrollanim
Scrollanim 是一款用 CSS3 和 JavaScript 实现的滚动动画库,它可以用在任何地方。



使用简单
Scrollanim 有很多内置的 CSS3 动画,你可以添加到元素的 data-kui-anim 属性上。

欢迎来到
高级模式
此外,还可以使用 JavaScript 来添加动画:

  1. kissuiScrollAnim.add(element, { 'in': 'fadeIn' });
复制代码

Scrolanim 支持元素所有可用的位置,还可以使用复合事件名称(如:"center middle")。


CSS3 动画
Scrolanim 有很多 CSS3 动画可以使用,没有 JavaScript 动画,使性能更好。可以运行在 PC 和移动设备。

无限动画
Scrolanim 的动画名接受 infinite 参数,可让动画一直重复播放。
下载地址:点我






帖子地址: 

回复

使用道具 举报

发表回复

您需要登录后才可以回帖 登录 | 注册

本版积分规则

快速回复 返回顶部 返回列表