web-dev-qa-db-ja.com

CSSの問題：a：hoverがIE（css Ninjaが必要）で機能しない）

IEタブa：hoverのサイトの背景色が変更されないのに、Firefox/Chrome/Safariでは正しく変更されるのはなぜですか？

IE 6+で動作させるにはどうすればよいですか？

[〜＃〜] html [〜＃〜]

<ul class="tabbernav">
<li class="tabberactive"><a title="All" href="javascript:void(null);">All</a></li>
<li class=""><a>Tab1<span class="tabTotal"> (0)</span></a></li>
<li class=""><a>Tab2<span class="tabTotal"> (2)</span></a></li>
<li class=""><a>Tab3<span class="tabTotal"> (1)</span></a></li>
</ul>

[〜＃〜] css [〜＃〜]

ul.tabbernav li a:hover {background:#fdfdfd; border: 1px solid #555; border-bottom: none; color:#3366a9; cursor: pointer}
htmlcssinternet-explorerfirefoxdhtml
13
TimJK

最初に行うことは、疑似セレクターの順序が正しいことを再確認することです。

そのはず-

a:link {color:#FF0000} /* unvisited link */  
a:visited {color:#00FF00} /* visited link */  
a:hover {color:#FF00FF} /* mouse over link */  
a:active {color:#0000FF} /* selected link */

私が覚えている唯一の特定のIEホバーの問題は非リンク要素に関連しているので、それはあなたの問題ではないと思います。 http://www.bernzilla.com/item。 php？id = 762 -念のため。

それでも質問に答えられない場合は、CSSの関連ブロックを投稿してもよろしいですか？

GAH-それは大変でした！

リンクにHref要素が関連付けられていないため、IEが壊れているようです。これを修正すれば、問題ないはずです。

-ニュース速報-私はばかかもしれません-それは私がテストページで変更した最後のことであり、それを修正しましたが、すべてを元に戻すとどこでも壊れました...だから私が投稿したものを一粒で取ってください塩。私は何が起こったのかを見るためにバックアップしています。

8
Kelly Gendron

href=""属性を<a>タグに配置する必要があります。

これは問題なく動作します。

また、ページの上部にある<!doctype html>タグを使用します。これですべてがうまくいくでしょう。

9
thinzar

これはとても簡単な修正です！ background-color：#fffをbackground：#fffに変更しても機能しない場合は、background-color：#fffffeを使用してください。

http://haslayout.net/css/Hover-White-Background-Ignore-Bug

1
Johan De Silva

<head>にブロータグを追加して修正します。

iE9の場合

<meta http-equiv="X-UA-Compatible" content="IE=9">

iE10の場合

<meta http-equiv="X-UA-Compatible" content="IE=10">
1
ali bagheri

追加してみてください：

display: block;
position: relative;

あなたのcssaに。

1
DLF

htmlファイルの先頭に次の行を追加できます。9以上で動作します。

       <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
0
Alireza815

今考えてみてください-Jqueryを使ってやってみませんか？ほんの数行のコードで、それを実行できます。

まず、 www.jquery.com からJqueryをダウンロードします。次に、HTMLの先頭にあるファイルに適切にリンクする必要があります。

<script src="url_to_your_jquery_file_here"></script>

次に、この下にJavascriptの別の部分を追加します。

<script type="text/javascript" language="javascript">
    $(document).ready(function() {
        $("li a").hover(
          function () {
            $(this).css("color", "#3366a9");
          }, 
          function () {
            $(this).css("color","#838383");
          }
        );
    });
</script>
0
Bruno Schweller

あなたはあなたのhtmlファイルの先頭に次の行を追加することができます、それはすなわち9で私のために働きます：

       <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
0
Alireza815

IE 7は、<a>以外の要素でのホバーの問題を修正したと思いますが、テストしていません。

IE 6の：hoverセレクターのサポートの欠如を補うには、javascriptを使用して同じ効果を得る必要があります。必要なクラスを適用するonMouseOverイベントを設定します。：D

0
Gordon Gustafson

CSSは有効に見えます。

A：hoverに「！important」を追加してみてください。また、定義内の他のスタイルを変更してみてください。カスケードを介してその特定のa：hoverスタイルをオーバーライドする他のスタイルがある場合があります。

FFのFirebugは、いくつかの競合するスタイルが継承されていることを示している可能性があります（ただし、IE6ではもちろん自分で作成しています）が、競合していないことを確認する必要があります。 a：ホバーはIE6で正常に機能します。これは、問題のあなたや他の人が

また、あなたが不潔な異教徒であると宣言した後、セミコロンと改行を入れてください！

0
jscharf

使用する <!DOCTYPE html>ページの上部にあります。発生する可能性のある問題やその他の問題を修正します。

0
Jeight

私は見つけたすべての解決策を試しました。私の場合、バグはGoogle Translatorによって決定されました。 IEおよびOpera（他のエラーが発生する場合））で削除しましたが、すべて正常に動作します。

0
Hatzegopteryx

IE行〜852）でjavascriptエラー（無効なプロパティ値）が発生します：

document.getElementById('panel-hlisting-all').style.backgroundColor = color;

ここで、colorの値は「＃ffff100」です。

これがあなたの問題の原因でしょうか？

0
uhleeka

IEは機能しません。代替はhtml要素のscript-event（jqueryなし）を介して設定されます：

<a onmouseover="this.style.textDecoration='underline'" onmouseout="this.style.textDecoration='none'" >  My link</a>
0
lison