纯CSS3加载Loading动画图 12款创意设计

38,445 人浏览

2014-02-17 19:46:55

我们经常使用GIF图片来实现Loading加载动画，确实利用GIF图片来实现也非常方便，但需要我们一定的制图功底，我们作为程序员很多对制图一窍不通，那么今天就让我们用CSS3代码来实现漂亮的Loading加载动画吧，下面的12款非常有创意的CSS3 Loading加载动画肯定会让你喜欢上CSS3，喜欢上HTML5。

在线演示源码下载

纯CSS3人物行走动画逼真炫酷CSS3动画

48,396 人浏览

发表回复

2014-02-15 21:50:16

CSS3实在是太强大了，今天分享的CSS3动画非常神奇，它可以模拟人物行走，而且人物行走动画非常逼真。人物行走时的跨步动画时多张图片重叠实现的。有了这个CSS3人物行走动画的基础，我们就可以更方便的在浏览器上实现HTML5游戏。

css3-walking-animation

在线演示源码下载

使用Visual Studio 2012开发HTML5应用

11,539 人浏览

发表回复

Visual Studio 一直以来是开发微软旗下应用的利器，只要是开发微软相关的应用无论是Windows程序，WPF，Asp.Net，WinRT Surface，WindowsPhone 等微软旗下的应用都可以使用Visual Studio 来开发。如果您已经非常习惯了Visual Studio 的UI和操作，是不是有时候也想使用Visual Studio 像DreamWeaver 一样来开发纯浏览器的HTML5的应用呢? [......]

阅读全文>>

CSS3渲染Checkbox实现3D开关切换按钮

25,599 人浏览

1条回复

这次我们需要利用checkbox结合CSS3来实现一个3D开关切换按钮，该CSS3按钮一共有4款不同的样式风格，有电器开关样式按钮、iPhone锁屏样式按钮等。该CSS3按钮的实现原理很简单，原型是一个checkbox，然后利用CSS3属性来渲染checkbox，从而实现3D按钮的效果。

css3-checkbox-3d-buttton

在线演示源码下载

纯CSS3 3D按钮按钮酷似牛奶般剔透

26,402 人浏览

发表回复

CSS3按钮一般都可以设计的非常漂亮，利用投影、渐变等CSS3属性特效可以把按钮渲染的十分动感。今天分享的这款CSS3按钮外观非常特别，它看上去酷似晶莹剔透的牛奶，而且在点击按钮时出现3D效果的动画，按钮按下时，按钮会轻轻的弹动一下，非常逼真。

接下来我们来分析一下实现这款CSS3 3D按钮的步骤及其代码，总体而言，这款CSS3 3D按钮主要由HTML代码和CSS代码组成。实现原理是用两个span来替代checkbox选中和不选中两个状态的样式。

HTML代码：

<div>
	<div>
		<input type="checkbox">
		<span></span>
		<span>+</span>
	</div>
	<div>
		<input type="checkbox" checked>
		<span></span>
		<span>–</span>
	</div[......]

阅读全文>>