HTML5对联在线演示

HTML5对联来了

2012-03-20 07:51 by 【当耐特砖家】, 446 visits, 收藏, 编辑

今天看到园子里的运动学基础，里面介绍了一些基本的缓动效果，突发创意利用tween效果制作了HTML5对联。

对联

对联，又称楹联或对子，是写在纸、布上或刻在竹子、木头、柱子上的对偶语句言简意深，对仗工整，平仄协调，是一字一音的中文语言独特的艺术形式。对联相传起于五代后蜀主孟昶。它是中华民族的文化瑰宝。

使用计算机制作对联作用如下：

1.整合入游戏，使其参入中国风；

2.广告视频制作；

3.网站左右悬挂，比如春节过年、圣诞、情人节、程序员节（1024）等节日悬挂相应的问候对联。

缓动

缓动的最大用处就是应用在设计的运动表现上，他可以结合物理，数学等原理真实地模拟显示生活中的运动现象。缓动还用于各种开场动画、游戏画面切换等场景当中。

flash、XNA、silverlight、HTML5、C++等各语言平台都有成熟的缓动库。

缓动函数

利用缓动函数可将自定义数学公式应用于动画。 例如，您可能希望某对象真实地弹跳或其行为如同在弹簧上一样。 您可以使用关键帧动画甚至 To/wait/To/wait·····动画来实现伪积分操作，大致模拟这些效果，但可能需要执行大量的工作，并且与使用数学公式相比动画的精确性将降低。所以：

在没有大量的粒子并且粒子之间没有相互作用的情况之下，推荐使用缓动函数。

一般成熟缓动库都包含下列这些缓动函数（同时开发开发者自定义缓动算法），方便开发者来创建常见效果。

• BackEase：在某一动画开始沿指示的路径进行动画处理前稍稍收回该动画的移动。

• BounceEase：创建弹跳效果。

• CircleEase：创建使用循环函数加速和/或减速的动画。

• CubicEase：创建使用公式 f(t) = t3 加速和/或减速的动画。

• ElasticEase：创建类似于弹簧在停止前来回振荡的动画。

• ExponentialEase：创建使用指数公式加速和/或减速的动画。

• PowerEase：创建使用公式 f(t) = tp（其中，p 等于 Power属性）加速和/或减速的动画。

• QuadraticEase：创建使用公式 f(t) = t2 加速和/或减速的动画。

• QuarticEase：创建使用公式 f(t) = t4 加速和/或减速的动画。

• QuinticEase：创建使用公式 f(t) = t5 加速和/或减速的动画。

• SineEase：创建使用正弦公式加速和/或减速的动画。

Flash对联

URL:http://sc.chinaz.com/FlashDemo.aspx?downloadID=1211421570040

完全使用flash制作，没有缓动效果，遮照出现偏差。如下图所示：

HTML5对联在线演示

作者：张磊 
出处：http://www.cnblogs.com/iamzhanglei
出处：IamZhangLei.com
本文版权归【当耐特砖家】和博客园共有，欢迎转载，但未经作者同意必须保留此段声明，且在文章页面明显位置给出原文连接，否则保留追究法律责任的权利。

 

分类: Javascript, HTML5