html5中文学习网

您的位置: 首页 > 网站及特效实例 > html5实验 » 正文

多种惊人的CSS3动画演示

[ ] 已经帮助:人解决问题

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

1.使用jQuery的CSS3时钟

css3 clockb6kHTML5中文学习网 - HTML5先行者学习网

2.模拟时钟

analogue clockb6kHTML5中文学习网 - HTML5先行者学习网

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

3d cubeb6kHTML5中文学习网 - HTML5先行者学习网

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

multiple 3d cubesb6kHTML5中文学习网 - HTML5先行者学习网

5. CSS3折叠

css3 clockb6kHTML5中文学习网 - HTML5先行者学习网

6. 自动滚动的视差

auto scrolling parallaxb6kHTML5中文学习网 - HTML5先行者学习网

7. Isocube

isocubeb6kHTML5中文学习网 - HTML5先行者学习网

8. 图片画廊

image galleryb6kHTML5中文学习网 - HTML5先行者学习网

9. 矩阵

matrixb6kHTML5中文学习网 - HTML5先行者学习网

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

javascript effect alternativesb6kHTML5中文学习网 - HTML5先行者学习网

11. 图片滑过效果

css3 clockb6kHTML5中文学习网 - HTML5先行者学习网

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

coke canb6kHTML5中文学习网 - HTML5先行者学习网

PS:这个例子和下面这个严格来说都不是用的CSS3技术,而是复杂的图片和css的background-position属性的应用。b6kHTML5中文学习网 - HTML5先行者学习网

13. 3D 房间

3d meninasb6kHTML5中文学习网 - HTML5先行者学习网

14. 宝利来画廊

polaroid galleryb6kHTML5中文学习网 - HTML5先行者学习网

15. 太空

注意: 这个演示依赖图形,需要一些时间来加载,但是结果非常疯狂!b6kHTML5中文学习网 - HTML5先行者学习网

spaceb6kHTML5中文学习网 - HTML5先行者学习网

16. Mac Dock

css3 clockb6kHTML5中文学习网 - HTML5先行者学习网

17. 滑入的模态窗口

drop in modalsb6kHTML5中文学习网 - HTML5先行者学习网

18. 滑动的唱片

sliding vinylb6kHTML5中文学习网 - HTML5先行者学习网

19. 放大的宝利来画廊

zooming polaroidsb6kHTML5中文学习网 - HTML5先行者学习网

20. 动画的火箭

animated rocketb6kHTML5中文学习网 - HTML5先行者学习网

21. Poster Circle

这个需要支持3D动画的浏览器才能看到全部效果,比如Mac版Safari4浏览器b6kHTML5中文学习网 - HTML5先行者学习网
poster circleb6kHTML5中文学习网 - HTML5先行者学习网

22. 变形的盒子

morphing cubesb6kHTML5中文学习网 - HTML5先行者学习网

23. 落叶

falling leavesb6kHTML5中文学习网 - HTML5先行者学习网

24. 动画效果宝利来画廊

polaroid galleryb6kHTML5中文学习网 - HTML5先行者学习网

25. 聚光灯投影

spotlight cast shadowb6kHTML5中文学习网 - HTML5先行者学习网

26. 彩色时钟

colorful clockb6kHTML5中文学习网 - HTML5先行者学习网

27. Lightbox 画廊(可拖拽)

css3 clockb6kHTML5中文学习网 - HTML5先行者学习网

28. 弹性所略图菜单

elastic thumbnail menub6kHTML5中文学习网 - HTML5先行者学习网

29. Coverflow

coverflowb6kHTML5中文学习网 - HTML5先行者学习网

30. 雪花

snowb6kHTML5中文学习网 - HTML5先行者学习网

31. jQuery DJ Hero

dj herob6kHTML5中文学习网 - HTML5先行者学习网

32. 动态的堆叠卡

stacking cardsb6kHTML5中文学习网 - HTML5先行者学习网

33. 另一个图片画廊

image galleryb6kHTML5中文学习网 - HTML5先行者学习网

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

snow stackb6kHTML5中文学习网 - HTML5先行者学习网

35. 动画的定价分组

animated pricing columnb6kHTML5中文学习网 - HTML5先行者学习网

36. 光滑的jQuery菜单

slick jquery menub6kHTML5中文学习网 - HTML5先行者学习网

37. CSS3

sticky notesb6kHTML5中文学习网 - HTML5先行者学习网

38. 不用Javascript的CSS Tabs

css tabsb6kHTML5中文学习网 - HTML5先行者学习网

39. 无JavaScript的Tab菜单

tab menusb6kHTML5中文学习网 - HTML5先行者学习网

40. SVG Fisheye菜单

fisheye menub6kHTML5中文学习网 - HTML5先行者学习网

41. 无Flash的动态演示

dynamic presentationb6kHTML5中文学习网 - HTML5先行者学习网

42. 旋转的画廊

rotating galleryb6kHTML5中文学习网 - HTML5先行者学习网

43. 下拉菜单

dropdown menub6kHTML5中文学习网 - HTML5先行者学习网

44. 另一个Fisheye效果

fisheyeb6kHTML5中文学习网 - HTML5先行者学习网

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

css3 animationb6kHTML5中文学习网 - HTML5先行者学习网

46. 另一个CSS3折叠

another accordionb6kHTML5中文学习网 - HTML5先行者学习网

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

css3 animation walkerb6kHTML5中文学习网 - HTML5先行者学习网

(责任编辑:)
推荐书籍
推荐资讯
关于HTML5先行者 - 联系我们 - 广告服务 - 友情链接 - 网站地图 - 版权声明 - 人才招聘 - 帮助