« ナルニア国物語 | メイン | 時代遅れが好き？ »
2006年04月02日（日曜日）
マウスをかざすと・・・ [ HTML＆CSS ]
kebaneco日記の「マウスオン覚えました！」に触発された、というか真似してみたくなっただけだが、画像の上にマウスをかざすと画像が切り替わるというものを試みてみた。適当な画像が無かったので、先日帰省したときのCafe Vinでの写真でも。入れ替わった写真では、きれいに陥没が出来ているのが分かる。こうじゃないと美味しいコーヒーは飲めないのだった・・・。
(マウスを画像の上にかざしてみて下さい。切り替われば成功ですが・・・。)
もしかしたら、最初は画像がキャッシュされてないため、表示が遅れるかもしれない。ちなみにどういうコードかと言うと・・・
<img src="http://static.flickr.com/47/121594330_7f46e85f95.jpg" onMouseOver="this.src='http://static.flickr.com/48/121594349_b5dcd94ae7.jpg'" onMouseOut="this.src='http://static.flickr.com/47/121594330_7f46e85f95.jpg'" width="500" height="375" alt="コーヒー注ぎ中および注ぎ終わり" />
いろいろ調べたのだけど、JavaScriptがらみの解説がほとんどで、上のような単純なHTMLコードだけというのが案外と無い。そのあたりが不安なのだが。これで上手くいくのなら、JavaScriptは不要のはずだし。うーん、謎だ。
[追記] tsura氏のコメントを読んで、2枚目の写真をブラウザにキャッシュさせるために、height="0" width="0" として表示してみた。つまり実際には画面に表示させることなく読み込むという小技(？)、tsura氏によればセコ技(笑)を使ってみた。確かに、切り替えのタイムラグが無くなったようだ。
投稿者 sukarabe : 2006年04月02日 12:03
トラックバック
このエントリーのトラックバックURL:
http://njet.oops.jp/cgi/mt/mt-tb-alt.cgi/1047
このリストは、次のエントリーを参照しています: マウスをかざすと・・・:
» 子猫モードから抜けられないマロ from kebaneco日記
一般的に人に飼われている猫はいつまでたってもおとなにならないといわれる。常に飼い主という親がいてその庇護下にあるからだって。去勢した猫はその傾向が特に顕著だ... [続きを読む]
トラックバック時刻: 2006年04月02日 14:24
» キャッチコピー from 経営笑談会
●即金 セコ技即金風雲録 ●ある魔法の文字をコピーするだけ！商品詳細説明 ある魔法の文字をコピーするだけで毎日３万円の入金！プリンターと魔法の文字の奇妙な組み... [続きを読む]
トラックバック時刻: 2008年12月08日 11:35
コメント
うまく行ってますよ～～！！
投稿者 kebaneco : 2006年04月02日 13:06
一応、MacのSafariとFirefoxでは確認したのですが、Windowsでも大丈夫ということですね。安心しました。でも、最初の読み込みでちょっと時間がかかるようです。まあ、お遊びだからいいか。
投稿者 sukarabe : 2006年04月02日 14:07
予め2枚目を別の場所に1×1ドットとかで表示させる（つまりサーバからブラウザのキャッシュにダウンロードさせてしまう）、というセコ技もありましたね…今は流行らないのかも…？
投稿者 tsura : 2006年04月03日 03:23
＞tsura様。
なるほど！なんか、昔のゲーム・プログラムとかのテクニックを連想しますね(笑)。さっそく試してみました。0x0で表示してみましたが、いい感じです。
投稿者 sukarabe : 2006年04月03日 10:15
コメントしてください
comment spam対策のため，名前とメールの入力が必須になっていますが，メールアドレスは公開されません。Web SiteのURLは任意です。Type Key IDをお持ちの方はType Keyをサイン・インしてくださってもいいです。