Web动画API教程5:可爱的运动路径(Motion Path)
随着API规范已经制定好并且通过,运动路径motion path也先后出现了不同的形式。单方向最初看起来可能是Effect的形式(如上一篇中讨论的GroupEffect),但随后Motion Path作为一个CSS模块慢慢的一点一点地上位(在它的规范中)。
随着API规范已经制定好并且通过,运动路径motion path也先后出现了不同的形式。单方向最初看起来可能是Effect的形式(如上一篇中讨论的GroupEffect),但随后Motion Path作为一个CSS模块慢慢的一点一点地上位(在它的规范中)。
HTML 是 Web 平台最重要的元素。它提供了各种构造站点和应用程序的底层特性。但是,一旦你开始用原生 HTML 标签实现一个复杂的组件,很容易就会变成 div 标签的堆砌。假如 Web 平台允许你创建自己的原始组件会怎样?假如你可以随意选择标签名会怎样?加入你可以扩展已有 HTML 标签的特性会怎样?自定义元素(Custom Elements)就允许你做这些事情。
在 Web 开发领域中,模板这个概念并不新鲜。实际上,服务端的模板语言/引擎,比如 Django (Python),ERB/Haml (Ruby),和 Smarty (PHP) 早已应用多时。近些年来,众多 MVC 框架蓬勃涌现。这些框架各有特色,但绝大多数在展现层(即:视图层)都使用同样的渲染机制:模板。
我们来继续我们关于Web动画API中多动画的探讨,讨论一下现在polyfill中提供的分组和序列功能。
在关于AnimationPlayer和时间轴的讨论之后,我们来看看多动画和多player吧。
现在我们已经知道如何使用统一Web动画API创建基本动画了,我们来谈谈动画状态及其控制、回调和时间轴。
最近我们开始在Onsen UI上使用Web Components API。API为开发人员提供了创建新的或扩展HTML标签元素的能力。我们重新使用Web Components API写一些简单的Onsen UI组件,但我们不会停止脚步,我们会继续努力。在这篇教程中我们将看看如何使用Web Components API实现一个简单的组件。我们将要学习的Web组件称为"favorite button / favorite star"。
我们已经初步了解了统一web动画API的内容,但是我们还没有真正去对规范的细节进行探讨,所以现在开始吧。WAAPI为你提供了比你用于CSS动画更多的控件,但是在了解它们之前,我们先打一下基础:如何使用这个API创建一个基本的动画?
最近将大部分时间花在了Web Components上面,不过这些花费的时间是有价值的。我整理了一个小组件,能更好的帮助大家更好的理解一个整体的Web Components。Web Components是一种新兴技术,用来规范组件的定制,这些都要非常感谢W3C组织。Web Components的目的就是允许开发人员使用HTML、CSS和JavaScript来自定义元素。这些元素可以被认为是一些小部件(widgets)。
众所周知,Web 页面是由 HTML+CSS+JavaScript 三板斧配合而成的,这体现了一种结构、表现、交互分离的思想。但是随着 Web 应用不断丰富,过度分离的设计也会带来可重用性上的问题。于是各家显神通,各种 UI 组件工具库层出不穷,煞有八仙过海之势。于是 W3C 坐不住了,大手一挥,说道:不如让我们统一一个 Web Components 的标准吧怎么样。