画像やSVGは使用せず、CSSで作成されたサークル・アロー・チェック・リストなど、Webページで使うさまざまなアイコンをJavaScriptで変形させるMarkaを紹介します。 変形は下記のように異なる形状へ変えたり、サイズやカラーだけを変更することもできます。もちろん、CSSで実装されたアイコンをそのまま利用するだけでもOKです。 Marka Marka -GitHub Markaのデモ Markaの使い方 Markaのデモ 上記gifアニメーションの実際の動きは、下記ページで楽しめます。 Chrome, Safari, Firefox, Opera, IEは10+でご覧ください。 各アイコンのスタイルシートファイル では、Markaの使い方を。 Step 1: 外部ファイル 当スタイルシートとスクリプトを外部ファイルとして記述します。 <head> ... <link rel="sty
![コレは使ってみたいな!CSSで作成されたアイコンをモーフィングで変形させるスクリプト -Marka](https://cdn-ak-scissors.b.st-hatena.com/image/square/c5d6381174d8a49c64801810fdd5a0d288df1988/height=288;version=1;width=512/https%3A%2F%2Fcoliss.com%2Fwp-content%2Fuploads-201403%2F2014082101.gif)