メニューなどで最近よく見かける、アイコンをクリック・タップすると、別のアイコンにアニメーションで変形させる単体のスクリプトを紹介します。実装も非常に簡単で、それぞれのアイコンとアニメーションを指定するだけでOK。IEは10+でご覧ください。デモページセレクトメニューは左から、元のアイコン、変化した時のアイコン、アニメーション、になっており、変更するとリアルタイムに楽しめます。いつものようにデモをアニメーションGIFにしてみました。見かけるハンバーガーアイコンを×アイコンに変形させます。外部ファイル当スクリプトとスタイルシートを外部ファイルとして記述します。HTMLアイコンを配置します。Awesomeのアイコンを使用していますが、BootstrapのGlyphiconsやオリジナルのものでも利用できます。JavaScript「from」に元のアイコン、「to」に変化した時のアイコン、「animation」にアニメーションを指定して、スクリプトを実行します。options);変化する時のアニメーションは、さまざまなものが用意されています。Posts関連記事が見つかりませんでした。