[JS]かなりかっこいいデザインのローディング用アニメーションを生成するスクリプト -Sonic

HTML5 Canvasを使って、ローディング用のアニメーションを作成する超軽量（約3K）のスクリプトを紹介します。 デモページ Sonicの実装 Square（矩形）とCircle（円形）を例に実装方法を紹介します。 外部ファイル 当スクリプトを外部ファイルとして指定します。 <script src="sonic.js"></script> JavaScript: Square（矩形） あとは、JavaScriptで記述するだけです。 var square = new Sonic({ width: 100, height: 100, fillColor: '#000', path: [ ['line', 10, 10, 90, 10], ['line', 90, 10, 90, 90], ['line', 90, 90, 10, 90], ['line', 10, 90, 10, 10]

[kzms2]

Canvasを用いたローディング

[snb04]

ローディングをjavascriptで！いつか使いたい

[rskmt346]

読み込み用、アニメーション

[yuta0121]

かっこいいデザインのローダー

[masaki0303]

かっこいいローディング用アニメーションを生成するJS。

[ni66ling]

[]デザイン

[blogpants]

かっけー！！

[tiadeen2]

Ajax的な読み込みであれば、そんな時間掛からないからローディングアニメが出る機会もあまりないけど、HTML5で何か凝ったことするのにちょっと時間掛かる時はいいのかも。

[kkeisuke]

loading

[ionis]

カッコいい。

[sionsou]

これはかっこいい [javascript][canvas][アニメーション][jQuery][html5][ローディング]

[AmaiSaeta]

要Canvas。 | 円形でないローディングアニメーションとは思いつかなかった。 | アニメGIFで良くね?という気もするが、Tumblrみたいな(画像使えない)とこだと助かるのかも知れん。

[koba04]

Loadingのアニメーションは手軽に面白いの作れそう。

[fujis_a]

うちの環境では動くのと動かないのがある。でもいいなコレ。

[soratomo]

Canvasで軽くコードだけで。

[o_hiroyuki]

ローディング用アニメーション

[adsty]

HTML5 Canvasを使ったローディング用アニメーション。

[www-tmcc]

Reader

[usamyu56]

なかなか良さ気

[yao3]

アイコン素材

[laislanopira]

ロ～ディングローディング～

[n_eremodel]

これで密かに社内の人気者になれそうだ

[fukurow57]

何がいいって凄く軽いところか。こういうの使ってみたいなぁ。

[tsuki-rs]

クオリティ高いのに超軽量！

[sbtqe]

プリローダー

[kanariia]

HTML5 Canvasを使って、ローディング用のアニメーションを作成する超軽量（約3K）のスクリプト

[hr07jp]

javascriptローディング用アニメーション

[warriorking]

(JS)かなりかっこいいデザインのローディング用アニメーションを生成するスクリプト -Sonic | コリス

[nors]

http://james.padolsey.com/javascript/sonic-looping-loaders/

[kams3261]

かなりかっこいいデザインのローディング用アニメーション