这令人印象深刻。 我们都看过纯CSS3动画,但是这个示例是迄今为止最雄心勃勃的示例之一。 它复制了经典的1967年《蜘蛛侠》卡通标题序列 (在Webkit浏览器(如Chrome或Safari)中打开链接)。
啊,美好的回忆! 该序列由美国网络开发机构Optimum7的Anthony Calzadilla构建。 他制作了动画的《星球大战》 AT-AT沃克 , 安德鲁·泰特劳(Andrew Tetlaw)在2月对其进行了分析 。
蜘蛛侠序列主要使用带有-webkit-animation声明的HTML5和CSS3。 使用了一些基于jQuery的JavaScript在场景之间切换,但是所有动画效果均由CSS处理。 最后,将HTML5 audio
标签用于主题调整。
Anthony指出,他最大的问题是动画和场景的定时,尽管他认为可以使用CSS3而不是JavaScript处理场景切换。
显然,在演示中已经付出了很多努力,并且Anthony提供了一些详细的技术说明 。 它显示了可能的结果,尽管我不相信许多开发人员会花时间或耐心手动编写此代码。 但是,如果像Adobe这样的公司考虑在其应用程序中提供动画CSS3导出功能,我就不会感到惊讶(尤其是由于某些平台禁止使用Flash )。
您是否发现了任何出色的CSS3动画示例?