[HTML5-SVG]使用raphaeljs:绘制哆啦A梦并实现动画效果
2013-04-17 16:15
756 查看
网上有人用css3实现哆啦A梦,我给他多加了个竹蜻蜓的动画,点击观看演示,兼容性并不好,只有webkit支持动画,ie下就是一堆方块。所以我想用svg技术来实现所有浏览器的兼容。
先来看下演示,目前知道的是ie6,7不支持动画,但是绘图还是没有问题的,ie6,7点击观看演示 最近对svg有些研究,先是使用svg代替css3实现qq空间关闭按钮旋转特效,然后是使用svg代替css3绘制opera图形,之前用css3实现的基本用svg都能实现。随着前端的发展,各种浏览器支持svg,svg的重要性会越来越大。
花了一天的时间写这些代码,注释都写在里面了。最后推荐一个很好用的工具aptana,javascipt代码提示很强,之前都是用dreamweaver,用来写html5和css3比较好用。
相关文章推荐
- [HTML5-SVG]使用raphaeljs:代替css3绘制opera图标效果
- [HTML5-SVG]使用raphaeljs:代替css3实现qq空间关闭按钮旋转特效
- 使用HTML5和jQuery插件Reel实现一个超酷的星际争霸2兵种动画360度预览效果
- 使用 SVG,实现带动画效果的圆环进度条
- 使用 SVG 动画实现弹性的页面元素效果
- 使用HTML5和jQuery插件Reel实现一个超酷的星际争霸2兵种动画360度预览效果
- Android中使用SVG实现炫酷动画效果
- 使用 SVG 来实现波浪 (wave) 动画效果
- 使用HTML5 SVG和CSS3制作边框运动的动画效果
- HTML5 Canvas动画效果实现原理
- Android中使用Animation实现控件的动画效果以及Interpolator和AnimationListener的使用
- 使用CSS3实现超炫的Loading(加载)动画效果
- 使用贝赛尔曲线画扇形、圆形、弧线、多边形,实现App下载时的动画效果demo
- 使用 html5 svg 绘制图形
- 使用缓动动画函数实现导航栏效果
- 使用HTML5实现刮刮卡效果
- 使用JS实现气泡跟随鼠标移动的动画效果
- Android中使用Animation实现控件的动画效果以及Interpolator和AnimationListener的使用
- 使用HTML5和jQuery插件Quicksand实现一个超酷的星际争霸2兵种分类展示效果
- 使用CCAnimate、CCAnimation、CCTextureCache、CCTexture2D来实现动画效果