当前位置: 首页 > 软件库 > Web应用开发 > CSS框架 >

JX.Animate

轻量级 CSS3 动画库
授权协议 未知
开发语言 JavaScript HTML/CSS
所属分类 Web应用开发、 CSS框架
软件类型 开源软件
地区 国产
投 递 者 杜辉
操作系统 跨平台
开源组织 腾讯
适用人群 未知
 软件概览

JX.Animate 是一个开源的轻量级的CSS3动画库。动画可以使用标准的CSS3关键帧动画(KeyFrame)制作,也可以使用JavaScript制作,而且还可以支持在JavaScript中动态生成动画关键帧。

JX.Animate将关键帧与动画播放选项分开控制。不仅可以灵活控制动画播放的效果,还可以将关键帧当做资源重用。

除此之外,本项目还包括一个基于HTML5的声音引擎(JX.Animate.Audio)。声音引擎采用声音对象池的方式实现,支持加载、播放声音的功能。配合动画播放的播放效果更好。        

在线演示

  • 使用css3可以在不使用javascript和flash的情况下让网页元素通过样式实现动画效果,让网站更加酷炫。 css3过渡 过度动画(trainsition)属性就可以实现让元素样式的过度,trainsition支持的浏览器有ie10,firefox,chrome和opera。 先来看看trainsition的几个属性: trainsition-property:规定应用过渡的css属性名称。

 相关资料
  • #animated_div{ width:76px; height:47px; background:#92B901; color:#ffffff; position:relative; font-weight:bold; font-size:20px; padding:10px; animation:animated_div 5s 1;

  • 问题内容: 我需要在某些文本上执行一系列动画处理,并且我打算使用CSS3。我的计划是使一些文本缓慢地在屏幕上向下移动,并到达屏幕的特定部分后,某些单词将被突出显示,最终文本将继续在屏幕上向下移动并消失,为进一步的文本留出空间。 我的问题是,“链接”这些动画的最佳方法是什么。我是否应该有一个用于向下移动屏幕的动画,一个用于突出显示文本的单独动画以及一个用于向下移动屏幕其余部分的动画?然后,是否应该将

  • 动画是进行形状变化和用元素创建动作的过程。 @keyframes 关键帧将控制CSS3中的中间动画步骤。 带左动画的关键帧示例 - @keyframes animation { from {background-color: pink;} to {background-color: green;} } div { width: 100px; height: 100px;

  • 问题内容: 无法使此动画图像正常工作,它应该进行360度旋转。 我猜下面的CSS有点问题,因为它保持静止。 问题答案: 这是 正确的动画CSS: 有关代码的一些注意事项: 您已将关键帧嵌套在规则中,这是不正确的 不适用于绝对定位的元素 看看caniuse:IE10不需要前缀

  • 问题内容: 我已经回顾了很多演示,并且不知道为什么我无法使CSS3自旋起作用。我正在使用最新的稳定版Chrome。 问题答案: 要使用CSS3动画,您还必须定义实际的动画关键帧( 您将其命名为) 配置了动画的时间后,您需要定义动画的外观。这是通过使用规则建立两个或更多关键帧来完成的。每个关键帧描述动画元素在动画序列中给定时间应如何呈现。

  • 我正在动画一个或多个div滚动到视图中。我是通过将动画css拆分成几个类(见下文)来做到这一点的。 动画div最初将具有类'.mpact-animated'和'.mpact-animated-pause'。div还将具有以下类之一'.mpact-shake'、'.mpact-heartbeat'或'.mpact-bounce'。这些动画类是由用户选择的,所以我不知道哪一个是要实现的。 当页面滚动时