Velocity.js:一个简单易用、高性能、功能丰富的轻量级JS动画库

简介: 最近在尝试使用 Vue3 + Vuex4 + Ant Design2 开发一个管理系统,在实现路由切换动画效果时候,无意发现一个轻量级脚本库:Velocity.js。

最近在尝试使用 Vue3 + Vuex4 + Ant Design2 开发一个管理系统,在实现路由切换动画效果时候,无意发现一个轻量级脚本库:Velocity.js。

image.png

简介

Velocity 是一个简单易用、高性能、功能丰富的轻量级JS动画库。能与 jQuery 完美配合,并和 $.animate() 有相同的 API, 它可以不依赖 jQuery,可单独使用。

Velocity 不仅包含了 $.animate() 的全部功能, 还拥有:颜色动画、转换动画(transforms)、循环、 缓动、SVG动画、和滚动动画等特色功能。

体验上 $.animate() 更快更流畅,性能甚至高于CSS3 animation, 是 jQuery 和 CSS3 transition 的最佳组合,它支持所有现代浏览器,最低可兼容到 IE8 和 Android 2.3。

Velocity 目前已被数以千计的公司使用在自己的项目中,包括WhatsApp、 Tumblr、 Windows、Samsung,、Uber 等,这里Libscore.com 统计了哪些站点正使用 velocity.js

片段

import Velocity from "velocity-animate";
const enter = (el, done) => {
    Velocity(el, "slideDown", { duration: 300 }, { complete: done });
};
const leave = (el, done) => {
    Velocity(el, "slideUp", { duration: 300 }, { complete: done });
};
export { enter, leave };

入口

需要体验可以去官方下载,并查看文档。

官方网址:velocityjs.org/

Github:github.com/julianshapi…


相关文章
|
6天前
|
JavaScript Java 测试技术
基于ssm+vue.js+uniapp小程序的多功能智能手机阅读APP附带文章和源代码部署视频讲解等
基于ssm+vue.js+uniapp小程序的多功能智能手机阅读APP附带文章和源代码部署视频讲解等
8 0
|
7天前
|
JavaScript 前端开发
|
7天前
|
JavaScript Java 测试技术
基于ssm+vue.js+uniapp小程序的学习视频资源库的系统附带文章和源代码部署视频讲解等
基于ssm+vue.js+uniapp小程序的学习视频资源库的系统附带文章和源代码部署视频讲解等
18 0
|
8天前
|
JavaScript Shell
Vue.js功能实现博客
Vue.js功能实现博客
|
9天前
|
前端开发 JavaScript
如何使用 await-to-js 库优雅的处理 async await 错误
如何使用 await-to-js 库优雅的处理 async await 错误
7 0
|
10天前
|
JavaScript Serverless 网络架构
Next.js与SSR:构建高性能服务器渲染应用
创建Next.js项目使用`create-next-app`,每个页面自动支持SSR。动态路由如`pages/posts/[id]`,在`getStaticPaths`和`getServerSideProps`中获取数据。利用静态优化和预渲染提升性能,动态导入减少初始加载时间。使用`next/image`优化图片,自定义服务器增加控制,集成第三方库如Redux。优化SEO,利用i18n支持多语言,使用Serverless模式和Web Workers。项目支持TypeScript,创建`_error.js`处理错误,部署到Vercel并使用工具进行性能监控和优化。
151 4
|
14天前
|
存储 JavaScript 前端开发
JavaScript实现记住用户名功能
JavaScript实现记住用户名功能
|
14天前
|
JavaScript 前端开发
JavaScript实现缓慢动画的封装
JavaScript实现缓慢动画的封装
14 0
|
移动开发 JavaScript 前端开发
Collie——基于 HTML5 的高性能 JavaScript 动画库
  Collie 是一个 JavaScript 库,用于创建高度优化的 HTML5 动画和游戏。Collie 可以运行在 PC 和手机上,使用 HTML5 Canvas 和 DOM。Collie 能够多线程稳定的处理多个对象,支持很多实用的功能,包括精灵动画和用户事件。
1339 0
|
1天前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp小程序的个人驾校预约管理系统附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp小程序的个人驾校预约管理系统附带文章源码部署视频讲解等
43 19