JavaScriptとCSSは不要！SVGの気持ちいいアニメーションで作られた超軽量のかわいいローディング -SVG Loaders
Post on:2014年12月10日
sponsors
JavaScriptもCSSも画像も使用せず、SVGで実装された軽快で気持ちいいアニメーションで動くローディングのアイコンを紹介します。
ページに実装する時もJavaScript/CSSは必要ありません。簡単なHTMLでOK！
SVG Loadersのデモ
デモは全部で12種類のローダーがあり、SVGなのでサイズやカラーなども簡単に変更して利用できます。
SVG Loadersの使い方
使い方は、簡単！
Step 1: SVGファイルをダウンロード
下記ページの右サイドの「Downlaod ZIP」から、SVGファイルをダウンロードします。
Step 2: HTML
あとは、imgタグで配置するだけです。
<img src="svg-loaders/puff.svg" />
アイコンのカラーを変更したい時は、svg要素のfill属性を変更します。
<svg fill="#fff" width="140" height="64" viewBox="0 0 140 64" xmlns="http://www.w3.org/2000/svg">
SVGアニメーションの各ブラウザのサポート
sponsors
