12款优秀的 jQuery 动画库

时间: 2019-07-10阅读: 47标签: 动画

Textillate.js

介绍:Textillate.js 是一个简单的CSS3文本动画插件。结合了一些非常棒的库,把 CSS3  动画轻松应用到任何文本。只需要在项目中简单地引入 textillate.js 和它的依赖文件到你的项目中,就可以开始建立独特的效果。


Lazy Line Painter

介绍:Lazy Line Painter 这款jQuery插件使用 Raphaël 库来创建路径动画。首先,从 Illustrator 导出您的艺术线条作为一个 SVG 文件,确保他们没有填充,没有封闭路径,线条需要一个开始点和结束点。


Tip Cards Plugin

介绍:提示卡插件让你可以创建的卡片式的布局,与你在谷歌的提示页面看到卡片状的互动效果类似。有几个新的动画选项,让您可以更具自己的喜好进行个性化配置。


jQuery Label Better

介绍:jQuery Label Better 帮助你标记表单输入域,拥有美丽的动画效果,而且不占用空间。在关于这个插件的唯一的是需要做的就是添加一个占位符文本,只有当用户需要它的时候,插件才会显示标签。


S Gallery

介绍:S Gallery 是一个响应的jQuery插件库,结合了 CSS3 动画。它利用了HTML5的全屏 API,并且在很大程度上依赖于对 CSS3  的动画特性和 CSS3 转换,所以它只能工作在支持这些功能的浏览器中使用。


Loda Button

介绍:Loda Button 是一个简单的jQuery插件,当数据从服务器被取出时,呈现按钮图标的动画。 CSS 类 loda-btn & load-icon 用于定义按钮的样式。动画效果使用了 CSS3 动画,过渡和转换。


Minimit Anima

介绍:Minimit Anima 是一个jQuery插件,呈现结合转换和过渡效果动画。它内置有快速动画的执行硬件加速的 CSS3  动画,同时它还有类似 jQuery 动画的 API,带有动画排队功能。


Motio

介绍:Motio 这款款jQuery插件用于创建简单但功能强大的基于精灵的动画和平移。Motio 调用一个表示元素的动画容器,其中动画被传递作为 CSS 背景图像。在基于子画面的动画,容器应该和子画面帧的尺寸一样大。


Mosaic jQuery Plugin

介绍:Mosaic 这款 插件自动生成滑动盒及字幕。它允许滑动和淡入淡出的动画,支持自定义方向。可以预加载框内的图像,只有大学 2kb 非常的轻量。


CSS动画@keyframes的用法

CSS动画允许大多数HTML元素的动画,而无需使用JavaScript或Flash!IE10+支持该属性的。其他低浏览器版本数字后跟-ms-, -webkit-,-moz-或-o-指定使用前缀的第一个版本。

值得你收藏的10个CSS3动画工具

在CSS3中引入了全新的动画语法,它能够帮助你在设计中实现许多有趣的事情。通常构建炫酷的动画是非常复杂和费时的,而使用动画库和生成器则可以帮助你完美处理这一切

设计师10大必备HTML动画工具

HTML 5已经成为Web开发者当中最流行的语言之一,“健壮的”语言有很大的生产优质万维网内容的能力。HTML 5在近三年的增长迅猛,新引入HTML 5的技术更加的优秀。HTML 5技术被现代浏览器所支持

vue中的过渡动画

记一次vue 组件中使用 transition 和 transition-group 设置过渡动画,总结来说可分为分为 name 版, js 钩子操作类名版, js 钩子操作行内样式版...template模板结构;name 版,name 为组件中的属性

css3 动画的暂停和重新开始

CSS3的animation直接提供一个 animation-play-state 属性规定动画正在运行还是暂停 。写动画样式的时候特别注意下不同浏览器的兼容性,加上对应的前缀 :

CSS 动画分类

CSS 动画主要分为CSS 动画分类和CSS 常用动画库简介与JS 动画;然后CSS 动画分类又分为过渡动画transition和关键帧动画keyframes,keyframes主要是从keyframes规则和keyframes属性来介绍

CSS3动画总结

常用特效/变换(transform)scale(2D缩放) rotate(2D旋转) translate(2D位移)skew(2D倾斜);keyframes这个属性用来定义一系列关键帧

Transform(CSS动态属性的开始)

transform 属性向元素应用 2D 或 3D 转换;该属性允许我们对元素进行旋转、缩放、移动或倾斜。这两点是Transform的概念和应用场景,重点在于2D和3D的转换,那么呢?

CSS3实现简易牛顿摆动画

最近在练习CSS3的关键帧动画(keyframes),于是做了一个简单的牛顿摆(听名字可能陌生,但你一定见过它),实现起来并不复杂,只需对最左和最右的小球进行关键帧动画处理,同时注意应该将绳子与小球作为一个整体

window.requestAnimationFrame 使用方式

window.requestAnimationFrame() 告诉浏览器——你希望执行一个动画,并且要求浏览器在下次重绘之前调用指定的回调函数更新动画。该方法需要传入一个回调函数作为参数

fly63.com版权所有,内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权,请与小编联系!情况属实本人将予以删除!

广告赞助文章投稿关于web前端网站点搜索站长推荐网站地图站长QQ:522607023

小程序专栏: 土味情话心理测试脑筋急转弯幽默笑话段子句子语录成语大全