CSS3真的很强大,但SVG的实力也不容小觑,今天我们要将它们两个有机结合,分享给大家150多个非常有趣的纯CSS3动画SVG图标。这150个SVG图标中,都拥有鼠标滑过的动画特效,有的是阴影特效,也有的是动感的动画,这些图标真的很酷。
纯CSS3实现打火机火焰动画
HTML5 Canvas火焰燃烧动画 如同掉落的火球
这次要分享的是一款超级绚丽的HTML5火焰动画,画面上是一个熊熊燃烧的小火球,小球燃烧的火焰非常逼真,会比较消耗CPU。另外这个动画是在HTML5 Canvas上实现的,修改起来也非常灵活。之前也分享过几款HTML5火焰动画,像这款HTML5 Canvas火焰闪烁动画。
HTML5 3D立方体动画 立方体可任意翻转
之前我们分享过很多基于HTML5的立方体动画了,有些是基于Canvas的动画特效,比如这款HTML5 webkit 3D立方体图片旋转滑块应用,就很不错。这次要分享的这款HTML5 3D立方体动画比较普通,它可以自己不停的旋转以凸显其3D的魅力。
jQuery带描述焦点图 文字描述上下滚动
今天我们来分享一款jQuery焦点图插件,这款焦点图是全屏的,看上去十分大气,另外,焦点图的每一张图片都带有文字描述,并且鼠标滑过图片时文字描述可以上下滚动。对于带文字描述的图片特效,我们还可以看看HTML5/CSS3图片描述效果 文字描述浮动在图片上。
HTML5积木动画 可选择飞入飞出动画效果
你是编程中的“快枪手”还是“慢悠悠”?
本文是html5tricks原创翻译,转载请看清文末的转载要求,谢谢合作!
一般而言,有两种类型的开发者。一种编码速度快,喜欢一大段一大段的组合代码,然后看它是否能顺利运行,这是编程中的“快枪手”,还有一种在朝着目标前进的时候比较淡定,他们会确保他们所写的一切代码都是精心设计的,可维护和可扩展的。因为这个原因,使得他们在速度上显得比别人慢,所以是“慢悠悠”。
两者之间的区别是,前者完成的效率更高,但代码的错误率更大(除非他们特别幸运),而后者代码的错误率就少多了,并且易于扩展和维护。亲你是哪一种呢?
愚蠢的“快枪手”?
大多数开发人员可能不敢承认自己是那种以良好的体系结构为代价的“快枪手”。为什么呢?因为这样可能会产生更高的错误率。但是回过头来想想,哪个系统没有代码错误?
拿我自己举个例子。
我如果接了个单子要写程序什么的,会有来自客户方面的压力,因为我必须及时交付。而客户对于软件的要求大多是通过电子邮件,电话告知的,或者在某些情况下,客户会直接写在票务系统里发过来。我的责任就是,确保程序的功能可以准确反映这些要求。而大家都知道,有时候客户想要什么却[......]
9款让你眼前一亮的HTML5/CSS3示例及源码
下面分享的这9款HTML5/CSS3示例及源码是最新出来的,应该和以前发布的没有重复,希望大家喜欢。
1、HTML5 3D点阵列波浪翻滚动画
还记得之前分享过的两款HTML5 3D波浪动画特效么?它们是纯CSS3/HTML5实现3D波浪形动画和HTML5 WebGL实验 超酷的HTML5 Canvas波浪墙,其中一款利用WebGL让3D效果渲染得淋漓尽致,不过也消耗CPU。今天我们要再分享一款基于HTML5 3D的点阵列波浪翻滚动画特效,同样是非常的壮观。
2、HTML5小球弹跳动画 很不错的3D小球
今天我要向大家分享一款很逼真的HTML5动画特效,它是3个色彩各异的弹跳小球,每一个小球在弹跳的时候都会有变化的小球投影,让整个动画更加逼真,而且具有3D的视觉效果。之前分享过小球跳动的Loading动画,效果也非常不错。
3、纯CSS3纸片层叠而成的庙宇动画
今天要分享的这款纯CSS3动画非常特别,动画主体的原型是一座庙宇的屋顶,它用3张纸片和一个小球层叠而成,首先不得不说,就这[......]