永发信息网

在 web 中,实现动画的方式有哪些?各自的利弊如何

答案:2  悬赏:10  手机版
解决时间 2021-11-12 12:35
在 web 中,实现动画的方式有哪些?各自的利弊如何
最佳答案
在Web里做动画选择其实已经很多了:
  可以用 Flash 技术来做动画;
  可以用 GIF 来做一个无需交互的动画;
  可以用 CSS3 的 animation;
  也可以用 CSS3 的 transition;
  也可以用 SVG 来做动画;
  甚至 CSS2 的hover也可以实现简单的动画;
  还可以用通过在 Canvas 上作图来实现动画;
  也可以借助jQuery.animate方便地实现动画;
  Flash动画
  不可否认,目前为止,Flash制作的动画在互联网还是占据了庞大的数量,几乎可以实现任何你想要的动画,甚至很多复杂的游戏都是用Flash实现,如果不是随着移动端的兴起,估计Flash会一直火热下去。
  GIF动画
  在以前,对于一些广告动画和一些小的icon动画之类的,GIF确实是不错的选择,体积还可以接受,制作也简单。但有GIF有一个致命的弱点就是不支持交互以及高清晰度的渲染,逐步的被JS和CSS3所替代。
  CSS Hover动画
  通过:hover我们可以实现一个滑动逐级展现的菜单,虽然非常简单,但这个是动画的雏形,在hover中,我们几乎可以为元素应用所有的css属性,并且兼容性不错。不过在ie6下只有a标签支持:hover。
  Javscript动画
  因为没有其它可用的实现方式,最初的前端动画都是JS来实现,实现上就是通过一个定时器setInterval每隔一定时间来改变元素的样式,动画结束时clearInterval即可。
  尽管这种方式动画的可控性很强,但是问题也很明显:
  1.性能不佳,因为需要不断获取和修改Dom的布局,所以导致了大量页面重排(repaint)。
  2.缺乏标准,不同的库使用了不同的API,导致即使是简单的动画也有各不相同的实现方式,调整起来比较耗时。
  3.带宽消耗,一个简单动画也需要引入一个类库,相对丰富的动画,代码量都很大,结果就是增加了http请求的大小,降低了页面的载入时间。
  CSS3动画
  CSS3动画相比与JS更轻量,性能更好,更易于实现,同时也不必担心缺乏标准和增加带宽消耗的问题。animation 相比 transtion 使用起来更为复杂,但也提供了更多的控制,其中最重要的就是 frame 的支持,不过通过一些简单的JS库
全部回答
学好3DMAX PHTOTSHOP MAYA技术 这是最主要的
我要举报
如以上问答信息为低俗、色情、不良、暴力、侵权、涉及违法等信息,可以点下面链接进行举报!
大家都在看
UGG驼色和沙色哪个更时尚。
大门朝南厨房在西方风水好吗
从呼兰乘坐553到道外16道街怎么走
陕西啸天文化传媒有限公司地址有知道的么?有
镶牙可以不镶在原来的地方吗如果邻牙长得比较
耳屎该不该挖?
连皮一块吃的虾是不是需要炸两次
装载机933eg和lg933e有区别吗
彩橙旅游上为什么没有旅游攻略
给喜欢的女生钱她不要为什么?
仙剑6这个地方控制扁洛桓这要干什么 周围没有
商洛云门舞集肚皮民族专业舞蹈培训地址好找么
泗阳杨树博物馆国家法定假日开放吗
请问有逝逝这个词吗
怎样才能知道自己的手机贝别人监控
推荐资讯
C++ MFC SetCurSel(0)的作用
浙大有自考可以报名吗
我和我姐姐以前困在深山里了 一个星期 我的腿
把活人钉棺材里的电影
紧急求救啊~~~~~~~~~~~~
GRAND VIN DE BORDEAUX 2007 Chateau L'E
三菱欧蓝德蓝牙如何用
炸肉陷辣椒的做法
250和90的最大公因数是谁
mysql8.0兼容jira6.3.6吗
水粉笔应该怎么挑选啊?
百菌清对兰花是喷雾还是灌根好
正方形一边上任一点到这个正方形两条对角线的
阴历怎么看 ?