如何在网页上用HTML5实现动画效果？

h5中做动画的方法有很多种，一个一个说吧。

1、h5元素本身的位移、缩放，控制css属性即可，left、right、top、bottom，width、height，另外使用transform可以完成更复杂的变化。

2、透明度属性可以完成渐隐渐现效果，切换background-image属性，background-color属性。

3、在画布元素canvas中绘制，这是很多h5游戏引擎实现动画的方法，可以去学习一个h5的游戏引擎。

4、还有一个是矢量图方式，svg代码，用代码控制svg元素也可以完成很好的动画效果，像d3.js这样的图表引擎便使用svg进行绘制。

Flash是由macromedia公司推出的交互式矢量图和 Web 动画的标准，由Adobe公

司收购。做Flash动画的人被称之为闪客。网页设计者使用 Flash

创作出既漂亮又可改变尺寸的导航界面以及其他奇特的效果。Flash的前身是Future Wave公司的Future

Splash，是世界上第一个商用的二维矢量动画软件，用于设计和编辑Flash文档。

Flash动画插入第一种方法：使用<embed>...</embed>标记动画会自动缩小

你可以嵌入到你的div中，高度和宽度用height和width设置

属性：

src=url(Flash路径)

width=像素/百分比（flash宽度）

height=像素/百分比(falsh高度)

wmode

window 使 flash 自身的矩形窗口来播放

opaque 使 flash 隐藏页面上位于它后面

transparent 使 flash的 背景透明

<embed src="你的flash.swf" width="600"></embed>

<embed src="你的flash.swf" wmode="window"></embed>

Flash动画插入的第二种方法： 使用<object>...</object>标记插入 flash 动画,也可以通过DW这个软件自动生成代码<object>,插入--多媒体--选择文件

三维动画二维渲染的通俗讲，就是做好的场景里摆放好摄影机的角度，然后以这个角度的视角渲染一张平面模式的图，一般卡通渲染等就多用到这些。

比如就要做一个卡通效果的图，但画起来立体角度等关系不好画，在三维软件轻松简历场景后，选个角度就渲染就出来了，还可以调整具体的参数达到不同的效果。各有所用，通常三维就是做仿真效果，二维就是在特定需要的情况下用，而这些特定情况下三维正常渲染达不到要求。

三维动画介绍：

又称3D动画，它不受时间、空间、地点、条件、对象的限制，运用各种表现形式把复杂、抽象的节目内容、科学原理、抽象概念等用集中、简化、形象、生动的形式表现出来。

三维动画技术模拟真实物体的方式使其成为一个有用的工具。由于其精确性、真实性和可 *** 作性，被广泛应用于医学、教育、军事、娱乐等诸多领域。

在影视广告制作方面，这项新技术能够给人耳目一新的感觉，因此受到了众多客户的欢迎。三维动画可以用于广告和电影电视剧的特效制作（如爆炸、烟雾、下雨、光效等）、特技（撞车、变形、虚幻场景或角色等）、广告产品展示、片头飞字等等。

---