Hamburgers是一款效果超酷的图标变形动画特效css3动画库。包括18种不同的变形动画效果，你还可以通过Sass文件来自定义你自己的图标变形动画。

安装

你可以通过bower或npm来安装Hamburgers变形动画。

bower install css-hamburgers
npm install hamburgers

需要在页面中引入hamburgers.css文件使用方法

<link href="dist/hamburgers.css" rel="stylesheet"></link>

html结构如下：

<button class="hamburger" type="button">
  <span class="hamburger-box">
    <span class="hamburger-inner"></span>
  </span>
</button>

你也可以使用<div>来代替按钮元素。

<div class="hamburger" type="button">
  <div class="hamburger-box">
    <div class="hamburger-inner"></div>
  </div>
</div>

然后你可以添加相应的class类来获取相应的图标变形动画。

<button class="hamburger hamburger--collapse" type="button">
  <span class="hamburger-box">
    <span class="hamburger-inner"></span>
  </span>
</button>

链接: https://fly63.com/nav/1653