创建酷炫动画效果的10个JavaScript库

boyanx5个月前技术教程14

Dynamics.js是设计基于物理规律的动画的重要JavaScript库。它可以赋予生命给所有包含CSS 和SVG属性的DOM(文本对象模型)元素,换句话说,Dynamics.js适用于所有JavaScript对象以及一系列其它的元素。目前,Dynamics.js常被用于设计交互式菜单栏、同步下拉菜单、加载器、按钮以及其它功能。这个库提供了可定制动画类型的各种基本选项,如频率、反弹力、旋转、摩擦、持续时间等等。

Cta.js 是用于在网页上创建动画元素“Action-to-Effect”路径的轻量级库。它常被用在tile-based应用程序的导航、模态窗口的打开、侧边栏上可点击的按钮等等。

Beep.js是一个通过使用WebAudio API创建基于网页的电子合成器的JavaScript库。它可以用于创建音乐或者设计和音乐相关的学习教程。

Rainyday.js是一个使用HTML5 canvas创建雨滴落在玻璃表面的出色效果的强大JavaScript库。它拥有一个集成了各种可自定义实现的动画组件的可扩展应用程序接口。

Iconate.js是一个可将设计图标转化为流行动画元素的伟大资源。它拥有大量可供选择的字体、字形图标以及自定义图标集。

Dom-Animator.js是一个在DOM(文本对象模型)中可显示内容节点里ASCII动画的JavaScript库。

Famous 是用于设计流行动画的强大JavaScript库,它包含的基于事件的系统(event-based system)使得渲染平滑动画和过渡特效这类的更新转换工作变得非常简单。Famous还有一个可创建自定义动画和动画仿真的3D物理引擎,你可以做出包含在不同的重力、拖放和碰撞下的粒子或者3D物体的状态。

Bounce.js 是一个在CSS 3的支持下能做出各种酷炫动画的JavaScript库。你可以设计不同的动画和运动效果,如自转、公转、来回运动、急加速等。

Snabbt.js是一个使用CSS3转换矩阵的轻量级JavaScript动画库。它的结构非常简单,支持各种过渡和运动效果的应用,如缩放、尺寸调整、扭曲、旋转等等。Snabbt.js还支持attention animation功能,这个功能在表单验证方面是非常有用的。

Rekapi是用于CSS动画关键帧动画以及DOM中JavaScript动画的高级avaScript库。在复杂动画的设计方面,Rekapi以其实用性被人们广为熟知。您可以使用Rekapi创建生动的饼图和曲线图、五彩纸屑、交互性时间线以及各种用户界面。

本文翻译自codecondo.com

本站文章除注明转载外,均为本站原创或翻译

标签: audio.js

相关文章

免费的网页版全功能合成器 Droid Resonator,还支持 MIDI 等多项功能

Droid Resonator 是一个基于浏览器的、免费的网页版合成器,使用 HTML/JS/CSS 和 Tone.js 构建。它具有6声部的和声功能(可演奏和弦) ,每个声部有3个压控振荡器(VCO...

p5.js 中文入门教程

本文简介点赞 + 关注 + 收藏 = 学会了本文的目标是和各位工友一起有序的快速上手 p5.js ,会讲解 p5.js 的基础用法。本文会涉及到的内容包括:项目搭建p5.js 基础2D图形文字图形样式...

Howler.js,一款神奇的 JavaScript 开源网络音频工具库

o Github Star: 23.4k[1]o 官网[2]Howler.js 是什么?Howler.js 是一款基于 JavaScript 支持现代网络的音频库,默认使用 Web Audio API...

SiriWave:用 JavaScript 开发的 Siri 风格音频波形

大家好,很高兴又见面了,我是"高级前端进阶",由我带着大家一起关注前端前沿、深入前端底层技术,大家一起进步,也欢迎大家关注、点赞、收藏、转发,您的支持是我不断创作的动力。什么是 Sir...

膨来仙岛丨搞电竞的都是什么成分?

膨来仙岛丨搞电竞的都是什么成分?

·x-_p-_o-[U2FsdGVkX19hlw/fiNvK0OFuRtSyqfr/bSkpuxPwGJDGjLyXwkFZPmnP7gJKXw749eK4Pq5CM3Oqd6H6jSSQ6XDft...

开源人声分离音频标注工具—基于Python

前言之前一篇介绍过音频标注开源工具包,大家反馈不错,今天介绍一个更易用专用性的人声分离音频标注开源工具,工具地址在文末。工具简介此工具是基于wavesurfer.js与Flask开发。提供Web界面进...

发表评论    

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。