CSS タイトル画像のロールオーバー・・・・
タイトルのヘッド画像のところにマウスをのせると画像が変るようにしたいのです・・・
リク記事です
自分のこのブログも以前に設定したままなので・・・・
どうやったか覚えていませんので・・・？
やり直す気持ちでやってみます
はじめはオリジナルスキンCSSの編集 ヘッド・タイトル3 の続きで
#header h1 a:hover にマウスがのった時の画像を設定すればいいや・・・
なんて軽く考えていました
たぶんいいはずなんですが・・・・・
画像が大きいからなんでしょうか？うまくいきません
一度クリックするとあとはうまくいくのですが・・・・
最初からは思ったように動いてくれません・・・・？
画像を先読みしないとダメなんでしょうか・・・？
・・・・・で、
つぎに考えたのが#headerにマウスが乗った時の画像を設定
#header h1 a に普段の画像を設定しておいて
#header h1 a:hover でマウスが乗った時に
display:none; と普段の画像の表示を消せば#headerに設定した画像が表示される・・・・
これなら両方の画像とも最初に読み込んでいるからスムーズに動くはず・・・・
結果は・・・・
なんかうまくいったようないってないような・・・・
画像がチカチカしてしまうんです
http://ameblo.jp/exlink001/ ここに仕込んであります
でも・・・・
この場合は・・・・
なんかヘビのおもちゃが悲鳴を上げているようで・・・
これはこれでよくないですか？
でも、皆さんに紹介するには失敗です
むかし・・・・？
ホームページを作ったときに使った方法・・・・
２枚の画像を１枚にして
background-position で表示位置を変更する方法なんですが
それなら最初から画像が読み込まれるのでうまくいくはず！！！！
って思い込んでいます
次にチャレンジしますのでもう少しお待ちください
どうせなら全部の画像をまとめて1枚にチャレンジしてみようかな・・・
出来るはずなんです・・・・・けど・・・・ たぶん・・・・