仿Material UI框架的动画特效

Material UI 是一款功能非常强大，界面却十分清新简洁的CSS框架，Material UI利用了Google的Material Design 全新设计语言，并且让每一个UI组件都变得非常独立，因此开发者使用Material UI也会比较简单。和Bootstrap类似，Material UI提供了很多常用的UI组件，除了最基本的菜单、按钮、滑动杆、进度条、单选框/复选框外，它还提供了一个非常有趣的日历组件，另外还提供了一些很有趣的图标。

 

不过，这里我并不打算介绍Material UI的使用，而是介绍如果实现Material UI内的动画特效，比如点击按钮会出现波浪扩散的动画效果、表单获取焦点动画等等。

 

注意：要使用下面的动画效果，必须引入jQuery。

 

一、点击按钮会出现波浪扩散的动画效果

 

为了效果，我这里特意将波浪的颜色加深。

先看效果：

	
		
		
		
		
		
	

	
		 点我 
	

　　

二、表单获取焦点的动画

 

效果如下：

　　

三、checkbox

 

下面用到了字体图标fontawsome

　　

 

 

参考：http://ghmagical.com/article/page/id/eJ6csiu8FkcD