Choiced by idobata 略して ちょw! idobata

« 「Gas Men(ガスメン)」見知らぬ人にガソリン代を手渡す粋なやつ | トップページ | 公衆無線LAN接続を利用できるプリペイドカードがコンビニで販売開始! »

動物の動きを学習できる絵本「GALLOP!(ギャロップ)」の原理をウェブ上に再現した「Parallax optical illusion with CSS」

あとで読む

以前“色々な動物の動きを学習できる「GALLOP!(ギャロップ)」”というエントリーで紹介した、絵本「GALLOP!(ギャロップ)」の原理をウェブ上でCSSを活用して再現した「Parallax optical illusion with CSS」というのがありました。

下記リンク先のデモページを表示して、ブラウザのウィンドウ幅をドラッグして伸縮させると、馬の走る動作を見ることができるというもの。

デモページ

原理は単純ですが、ウェブ上でそれを再現しているところがアイデアですね。

何か面白いサイトを作るヒントになりそうです。

解説やサンプルページのデータのダウンロード等は下記リンク先です。

A parallax optical illusion with CSS: The Horse in Motion


■ Amazon.co.jp
Gallop!
Rufus Butler Seder

0761147632


Magic Moving Images: Animated Optical Illusions (Animated Optical Illusions)
Colin Ord

1899618740

関連商品
Magic Moving Alphabet
うごく浮世絵!? (びじゅつのゆうえんち)
The Little Red Hen
Hooray for Snail (Jp 087)


■ 楽天ブッックス
GALLOP!

■ 楽天:洋書屋ジロー
GALLOP!

トラックバック

このページへのトラックバックURL:
http://idobata.info/cgi-bin/mt2/mt-tb.cgi/1288

Amazon.co.jp最新ランキング

Powered by
Movable Type