揺れるキリン
朝のまどろみは時々アイデアが降りてくる。
大抵は意味不明で使えないアイデアで、今回も揺れるキリンのイメージが浮かんだので作ってみた。
手法はFlashではよく使われてるもので画像を1ピクセル毎にスライスしたものを用意して動かすのだけど最近はFlash使って無いのでjQueryで作ることにした。
手順は下記の様な感じ
・画像を読むのを待つ。
・ul＆liのリストで縦ピクセル分にスライスする。
・スライスした画像を背景にして背景の位置を動かす。
やってみるとfirefoxではスローモーションになってるので背景の位置を変えず余白を変更する事で動かしてみたが解決しなかった。firefoxは苦手なのかもしれない。
kirin wave
※キリンの絵をクリックするとアニメーションが始まり、もう一回クリックすると止まります。
全く無意味だけどjQueryプラグイン化してみた。
更に世界一簡単なGithub入門を見ながら作ったライブラリをGithubで公開してみた。（Gitすら分ってないので怪しいですが）
https://github.com/uda2/kirinwave
最終的に一番時間が掛かったのはキリンの絵を描く行程でした。
Tags: Github, jQuery プラグイン