様々な議論がされているハンバーガーメニューですが、ハンバーガーメニューを実装しているサービスやアプリはまだまだ多いので、自分も使ってみようというデザイナーさんもまだまだ多いことかと思います。

そこで、今日は様々なハンバーガーメニューのCSSアニメーションが実装可能な『Hamburgers』をご紹介。アニメーションの勉強的に見てみるのも良いかと思いますので、是非ご覧くださいー。

Hamburgers by Jonathan Suh

ページ無いのUsageより使い方は説明されてありますが、Scssファイルも用意されているのが嬉しいですね。モジュールとして必要な物をチョイスして実装することも可能でしょうし、細かなカスタマイズも用意に行えそうです。

対応ブラウザとしては、IE9以前と、Opera Mini系はサポートされていませんが、CSS3 3D Transformsが実装されているブラウザだと動かす事が出来るようなので、是非一度トライしてみてはいかがでしょうか？

各アニメーションの詳細を見たい方は、サイト上から各ハンバーガーアイコンをクリックするだけで挙動を見る事も出来るので、お試しくださいー！