Welcome, Old Sport!

一款SVG时间轴动画

by ilikecss ON 2015/11/17 3776

一款SVG时间轴动画最近一直在研究SVG图像,因为其特殊性,在很多浏览器都无法支持,.SVG格式还需要IIS开启相应的功能后才能显示。市面上有不少开源类的javaScript插件来支持SVG动画,大家可以去搜索一下。SVG动画比CSS3的动画显得更灵活,表现力上也更胜一筹。下面就介绍一款基于Raphaël类库的时间轴动画。

Raphaël一个小型的javaScript类库,简化你在网页上对矢量图形应用操作。Raphaël是基于SVG W3C标准下开发的,每一个图形对象都是一个DOM对象,这样你就可以通过javaScript来实现对DOM的操作。

javaScript

<script type="text/javascript" src="js/raphael-min.js"></script>
<script type="text/javascript" src="js/timeline.js"></script>

Can i use…

案例中菜单部分使用css3,浏览器支持参照: http://caniuse.com/#search=svg

具体代码不写在这里了,请有需要的朋友在文章后留言,我会通过邮件转发源码。

19条评论
  1. #1

    金刚禅狮子吼说道:

    哎呦,不错哦~ :razz:

  2. #2

    爆实惠说道:

    8错,马克 :mrgreen:

  3. #3

    好文推荐说道:

    关注一下

  4. #4

    LovePanda说道:

    您好,最近小弟在再學習SVG,能和您要具體代碼來研究一下嗎?

  5. #5

    b19mu44说道:

    关注。谢谢分享!

  6. #6

    anger说道:

    请发我源码,谢谢谢谢谢谢谢 :lol:

  7. #7

    anger说道:
  8. #8

    Sim说道:

    楼主我也要代码

  9. #9

    西瓜说道:

    楼主,源码能不能也发我一份?




TOP