google水波按钮效果

因为用到了sass，所以先安装sass。

http://www.cnblogs.com/morong/p/4329957.html

这篇博客将安装过程和使用方法介绍的很清楚。

简单来说，就是sass需要依赖ruby环境，因此先去ruby官网下载文件安装，安装时记得勾选Add Ruby executables to your PATH这个选项，添加环境变量，不然以后使用编译软件的时候会提示找不到ruby环境。

然后点击电脑的开始菜单，点击Start Command Prompt with Ruby，在命令行里面依次输入如下命令（此法为淘宝镜像）：

安装完毕即可，上面提到的博客写的很详细，看不懂的可以去看。

看一下目录结构：

css文件夹下面的style.css是通过命令生成的。

新建style.scss文件，按照语法规则编写完毕后，进入项目文件夹，输入sass style.scss style.css

index.html

style.scss

style.css(此文件为命令编译生成，不是手写)

main.js(为重复利用，封装成插件)

效果图：