【トレビアン】CSSで画像が動いてるように見える!?
2008年06月16日13時20分 / 提供:トレビアンニュース
「CSSを使って画像をアニメーションさせる」というトンデモ技術を駆使したデモを置いているサイトがある。
こちらのサイトにFirefoxでアクセスしてほしい(InternetExplorer6未対応)。
ページを開いたらブラウザの幅を変えてみよう。
何か変化が起きたのがわかるだろうか?
そう、馬がアニメーションしているのだ。これはCSSにより2枚の画像を重ね上にゼブラ状の画像を、その下に馬の画像を置いている。
もっとわかりやすいカラクリは、下記の動画を見て頂ければいい。
こちら『MAGIC MOVING IMAGES』といって、アマゾンなどでも購入できる面白い小冊子なのだ。
実物は歯車が回ったりと、いろいろなアニメーションが堪能できるものとなっている。
このサイトは、その本を応用した物といえるだろう。
ソースも公開されているので、自分の好きな画像をアニメーションさせてみてはいかがだろうか?
参照:A parallax optical illusion with CSS: The Horse in Motion(Firefoxでアクセスしてください)
■オススメ! 最新人気トレビアンニュース
・3の倍数になるとアホになる『ナベアツ.in』
・予告in、予告outに続いて『予告.off』までも……
・『メタルギアソリッド4』売り上げ今ひとつ……
・犯罪予告を検知する『予告in』が激安完成! 『予告out』も!
・女性が“あの日”であることを表している合図?
・あのブログが1周年を迎えた! 2年目はこんな記事が出る?
・トレビアンニュース記事をもっと見る!
こちらのサイトにFirefoxでアクセスしてほしい(InternetExplorer6未対応)。
ページを開いたらブラウザの幅を変えてみよう。
何か変化が起きたのがわかるだろうか?
そう、馬がアニメーションしているのだ。これはCSSにより2枚の画像を重ね上にゼブラ状の画像を、その下に馬の画像を置いている。
もっとわかりやすいカラクリは、下記の動画を見て頂ければいい。
こちら『MAGIC MOVING IMAGES』といって、アマゾンなどでも購入できる面白い小冊子なのだ。
実物は歯車が回ったりと、いろいろなアニメーションが堪能できるものとなっている。
このサイトは、その本を応用した物といえるだろう。
ソースも公開されているので、自分の好きな画像をアニメーションさせてみてはいかがだろうか?
参照:A parallax optical illusion with CSS: The Horse in Motion(Firefoxでアクセスしてください)
■オススメ! 最新人気トレビアンニュース
・3の倍数になるとアホになる『ナベアツ.in』
・予告in、予告outに続いて『予告.off』までも……
・『メタルギアソリッド4』売り上げ今ひとつ……
・犯罪予告を検知する『予告in』が激安完成! 『予告out』も!
・女性が“あの日”であることを表している合図?
・あのブログが1周年を迎えた! 2年目はこんな記事が出る?
・トレビアンニュース記事をもっと見る!
Ads by Google
コメントするにはログインが必要です
関連ニュース:トレビアン
- 【トレビアン韓国】「日本に盗られた!」認識不足で商標権をどんどん逃がす韓国
トレビアンニュース 11月02日16時15分(84) - 【トレビアン韓国】「オバマ大統領のお辞儀にショック!」韓国でも賛否両論
トレビアンニュース 11月17日20時05分(56) - 【トレビアン韓国】ドイツの博物館で地図落書き事件が発生、「日本海→東海」へ
トレビアンニュース 10月30日15時25分(56) - 【トレビアン韓国】「背の低い男は負け組!」女子大生の問題発言でネット炎上
トレビアンニュース 11月10日16時40分(36) - 【トレビアン】とくダネ司会の小倉降板? 引き継ぎ内定はミヤネトレビアンニュース 11月17日13時00分(35)
|
470円
Kelly
|
5,145円
Kelly
|
4,620円
グレイスアートコム
|
4,620円
グレイスアートコム
|
ITアクセスランキング
- 「ジョジョ」夫人が東大駒場祭に登場 荒木先生との“奇妙な生活”について語る
はてなブックマークニュース 24日17時55分(8) - グーグル参入で新OS戦争勃発!マイクロソフト戦略大転換の成否(上)ダイヤモンド・オンライン 25日11時05分(5)
- アメリカ空軍がPS3を2200台お買い上げ!Kotaku JAPAN 24日17時00分(6)
- 【韓国】ドラゴンボールオンラインの最大の長所は「原作の正統継承作」インターネットコム 24日12時10分(12)
- ソニー、痛恨のミスに謝罪!6日発生の「NHK杯フィギュア」問題の対策を発表ITライフハック 24日07時00分(4)
- 国内PCベンダーでは最も安価なデュアルコアCULVノートPC「FMV-BIBLO LOOX C/E50」を試す
+D PC USER 24日01時17分 - この10年でネットで起きた「最も影響が大きかった出来事」ベスト10GIGAZINE 24日16時37分(5)
- デカすぎる!これが大画面の「ニンテンドーDSi LL」だ
ITライフハック 24日09時00分(9) - 「IBMがCellプロセッサの開発を中止した」という報道、ソニーの次世代ゲーム機「PS4」に搭載されるプロセッサはどうなるのかGIGAZINE 24日12時25分(6)
- [ダビング10]解除ソフト販売容疑で東芝社員逮捕 全国初毎日新聞 25日12時55分
注目の情報
47才の男が使うと…今、このシャンプーが90万本もバカ売れしている。なんでも通販のみ
にも関わらず、「毛髪に悩む男性」に凄く売れてるのだと。試しに注文
してみると…「えーっ!」と驚くほど。それは47才の…
ある男が語る秘密≫



















行きの電車、帰りの電車で