注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

飘泊

努力做到全面...

 
 
 

日志

 
 

47个效果惊人的CSS3动画演示  

2010-03-11 14:21:49|  分类: DIV+CSS |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |

或许你已经看过很多关于CSS3动画的技术,包括前端观察之前发表的一些,那么现在就情看一看CSS3动画的魅力吧。这里是一辑47个令人瞠目结舌的CSS3动画演示。他们演示了CSS3能给我们带来的巨大的可能性。

1.使用jQuery的CSS3时钟

47个效果惊人的CSS3动画演示 - 蚊子 - 飘泊

2.模拟时钟

47个效果惊人的CSS3动画演示 - 蚊子 - 飘泊

3.使用方向键旋转的3D盒子

47个效果惊人的CSS3动画演示 - 蚊子 - 飘泊

4.多个3D盒子(滑入/滑出)

47个效果惊人的CSS3动画演示 - 蚊子 - 飘泊

5. CSS3折叠

47个效果惊人的CSS3动画演示 - 蚊子 - 飘泊

6. 自动滚动的视差

47个效果惊人的CSS3动画演示 - 蚊子 - 飘泊

7. Isocube

47个效果惊人的CSS3动画演示 - 蚊子 - 飘泊

8. 图片画廊

47个效果惊人的CSS3动画演示 - 蚊子 - 飘泊

9. 矩阵

47个效果惊人的CSS3动画演示 - 蚊子 - 飘泊

10. 7个使用CSS3的Javascript效果替代

47个效果惊人的CSS3动画演示 - 蚊子 - 飘泊

11. 图片滑过效果

47个效果惊人的CSS3动画演示 - 蚊子 - 飘泊

12. 转动的可乐罐 (通过滚动条控制)

47个效果惊人的CSS3动画演示 - 蚊子 - 飘泊

PS:这个例子和下面这个严格来说都不是用的CSS3技术,而是复杂的图片和css的background-position属性的应用。

13. 3D 房间

47个效果惊人的CSS3动画演示 - 蚊子 - 飘泊

14. 宝利来画廊

47个效果惊人的CSS3动画演示 - 蚊子 - 飘泊

15. 太空

注意: 这个演示依赖图形,需要一些时间来加载,但是结果非常疯狂!

47个效果惊人的CSS3动画演示 - 蚊子 - 飘泊

16. Mac Dock

47个效果惊人的CSS3动画演示 - 蚊子 - 飘泊

17. 滑入的模态窗口

47个效果惊人的CSS3动画演示 - 蚊子 - 飘泊

18. 滑动的唱片

47个效果惊人的CSS3动画演示 - 蚊子 - 飘泊

19. 放大的宝利来画廊

47个效果惊人的CSS3动画演示 - 蚊子 - 飘泊

20. 动画的火箭

47个效果惊人的CSS3动画演示 - 蚊子 - 飘泊

21. Poster Circle

这个需要支持3D动画的浏览器才能看到全部效果,比如Mac版Safari4浏览器

47个效果惊人的CSS3动画演示 - 蚊子 - 飘泊

22. 变形的盒子

47个效果惊人的CSS3动画演示 - 蚊子 - 飘泊

23. 落叶

47个效果惊人的CSS3动画演示 - 蚊子 - 飘泊

24. 动画效果宝利来画廊

47个效果惊人的CSS3动画演示 - 蚊子 - 飘泊

25. 聚光灯投影

47个效果惊人的CSS3动画演示 - 蚊子 - 飘泊

26. 彩色时钟

47个效果惊人的CSS3动画演示 - 蚊子 - 飘泊

27. Lightbox 画廊(可拖拽)

47个效果惊人的CSS3动画演示 - 蚊子 - 飘泊

28. 弹性所略图菜单

47个效果惊人的CSS3动画演示 - 蚊子 - 飘泊

29. Coverflow

47个效果惊人的CSS3动画演示 - 蚊子 - 飘泊

30. 雪花

47个效果惊人的CSS3动画演示 - 蚊子 - 飘泊

31. jQuery DJ Hero

47个效果惊人的CSS3动画演示 - 蚊子 - 飘泊

32. 动态的堆叠卡

47个效果惊人的CSS3动画演示 - 蚊子 - 飘泊

33. 另一个图片画廊

47个效果惊人的CSS3动画演示 - 蚊子 - 飘泊

34. 雪栈 (用方向键控制)

47个效果惊人的CSS3动画演示 - 蚊子 - 飘泊

35. 动画的定价分组

47个效果惊人的CSS3动画演示 - 蚊子 - 飘泊

36. 光滑的jQuery菜单

47个效果惊人的CSS3动画演示 - 蚊子 - 飘泊

37. CSS3

47个效果惊人的CSS3动画演示 - 蚊子 - 飘泊

38. 不用Javascript的CSS Tabs

47个效果惊人的CSS3动画演示 - 蚊子 - 飘泊

39. 无JavaScript的Tab菜单

47个效果惊人的CSS3动画演示 - 蚊子 - 飘泊

40. SVG Fisheye菜单

47个效果惊人的CSS3动画演示 - 蚊子 - 飘泊

41. 无Flash的动态演示

47个效果惊人的CSS3动画演示 - 蚊子 - 飘泊

42. 旋转的画廊

47个效果惊人的CSS3动画演示 - 蚊子 - 飘泊

43. 下拉菜单

47个效果惊人的CSS3动画演示 - 蚊子 - 飘泊

44. 另一个Fisheye效果

47个效果惊人的CSS3动画演示 - 蚊子 - 飘泊

45. 逐帧动画(鼠标经过时演示)

47个效果惊人的CSS3动画演示 - 蚊子 - 飘泊

46. 另一个CSS3折叠

47个效果惊人的CSS3动画演示 - 蚊子 - 飘泊

47. AT-AT Walker (没有用Flash或JavaScript)

47个效果惊人的CSS3动画演示 - 蚊子 - 飘泊

  评论这张
 
阅读(235)| 评论(0)
推荐 转载

历史上的今天

在LOFTER的更多文章

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2017