on:2014年8月22日sponsors画像やSVGは使用せず、CSSで作成されたサークル・アロー・チェック・リストなど、Webページで使うさまざまなアイコンをJavaScriptで変形させるMarkaを紹介します。変形は下記のように異なる形状へ変えたり、サイズやカラーだけを変更することもできます。CSSで実装されたアイコンをそのまま利用するだけでもOKです。-GitHubMarkaのデモMarkaの使い方Markaのデモ上記gifアニメーションの実際の動きは、下記ページで楽しめます。IEは10+でご覧ください。Marka左右の矢印で、変形します。シェイプ、+-x*の記号、フォームのチェックやリスト、ナビゲーションのアローなどが揃っています。-MarkaMarkaの使い方と、使い方の前に、、、各アイコンは画像やSVGではなく、下記のようにCSSで作成されています。各アイコンのスタイルシートファイルでは、Markaの使い方を。外部ファイル当スタイルシートとスクリプトを外部ファイルとして記述します。アイコンの設置スクリプトを初期化し、アイコンを配置します。Marka('#icon');</script>同じアイコンを複数設置する場合は、下記のようになります。Marka('.icon');</script>異なるアイコンを設置する場合は、スクリプトをそれに合わせて設定します。アイコンの変形18種類のアイコンはそれぞれすべてに変形が可能で、スクリプトで変形する形状を指定します。3000);アイコンのカラーやサイズを変更させることもできます。3000);アイコンのカスタマイズMarkaでは18種類のアイコンが使用できますが、必要なアイコンのみのセットを作成することもできます。下記ページで、必要なアイコンをチェックし、スタイルシートファイルをダウンロードできます。Posts関連記事が見つかりませんでした。