FC2ブログ ロールオーバー

質問

私はＦＣ２でブログをやっていてheaderの画像をロールオーバーを使いマウスが上に行ったときに違う画像が表示されるというのに挑戦し以下のものを使ってみたのですがFireFoxではちゃんとロールオーバーできたのですがＩＥやスレイプニルだとロールオーバーできません。何か心辺りのある方がいらっしゃいましたらご教授お願いします。

#header_body {

width: 810px; /* 画像1枚分の横幅 */
height: 250px; /* 画像1枚分の高さ */
margin:10px 5px 10px;
background-image: url("http://～"); /* 画像ファイル名 */
}
#header_body:hover {
background-position: top right; /* 背景画像の表示開始基準を右上に変更 */
}

回答No.5

Muller3 · ベストアンサー

例えばHTMLで
<div id="header_body">
<h1><a href="http://***">ブログタイトル</a></h1>
</div>
こうなっているとしたら、

#header_body a {
display: block;
width: 810px; /* 画像1枚分の横幅 */
height: 250px; /* 画像1枚分の高さ */
margin:10px 5px 10px;
background-image: url("http://～"); /* 画像ファイル名 */
}
#header_body a:hover {
background-position: top right; /* 背景画像の表示開始基準を右上に変更 */
}

こんな感じです。
お使いのテンプレートのHTML構造がわからないので概略だけですが…。

お礼

ありがとうございます！！解決しました！！なんとお礼を言っていいことやら＾＾本当にありがとうございました！！

回答No.4

Muller3

ビヘイビアだめなのですか。
だったら、質問者様が契約しているプロバイダに、無料ホームページスペースがあると思います。そこにhtcファイルをアップして、そっちから引くというのは？（これも未検証ですけど）

というか、ヘッダーの画像だったら、a要素使うのではだめなのですか？
ブログタイトルにaタグ使ってブログのURLをリンクしてるならできるんじゃないでしょうか。

お礼

やってみたんですが出来ませんでした；；

a要素を使うというのはどうやれば出来るんですか？すいません、本当に素人なんで右も左もわからないんで。

回答No.3

Muller3

http://www.xs4all.nl/~peterned/csshover.html#changes
から
Version 2.02.060206 (1.42 and :focus) をダウンロード。
csshover2.htcというファイルになります。
これをFC2ブログの「ファイルアップロード」からアップします。
一覧に出てきたら、一番左の「表示」をクリックするとcsshover2.htcのスクリプトがポップアップで出てきますので、ブラウザのアドレス欄に表示されているURIをコピー。（「表示」の上で右クリックして「リンク先のURLを取得」してもいい）

その後、テンプレートのCSSに
body { behavior:url("csshover2.htcのURLをここにペースト"); }
を入れる

という感じだと思います。

お礼

FC2だとhtcファイルはアップロードできませんと出てしまうのですがどうすればいいですか？

回答No.2

noname#100277

>>スレイプニルでも同様の問題が起きるのは同じ原因ですかね？

エンジンが同種で在れば同じでしょう。
但しgeckoに設定した場合は別。

お礼

なるほど、ありがとうございます。

よろしければ、ＩＥでhoverを表示する為の具体的なやり方を教えてください。素人なんでググってみても解決できませんでした；

回答No.1

Muller3

IEではa以外でhoverが効かないので。
「hover IE」で検索かけてみると、方法がいろいろ出てきます。
http://www.google.com/search?client=safari&rls=ja-jp&q=hover+IE&ie=UTF-8&oe=UTF-8

お礼

ありがとうございます。色々いじってみようと思います。スレイプニルでも同様の問題が起きるのは同じ原因ですかね？