1

IE8+のための最善の方法を喜んで行います

#fffテーブルの行の色（ 、 ）を交互に変えたいのです#efefefが、ホバリング効果があるので、背景がに変わります#D2DEE8。:hoverCSSで使用したいのです:nth-child(odd)が、これらのメソッドはIE8では機能しないことがわかりました。

ホバリングにjQueryを使用していましたが、ホバリングしてその行を離れるたびに、交互の色（現時点ではnth-child（odd）を使用して作成しています）が削除されます。

    $(".DefaultTable tr").not(".DefaultTable .nohover").hover(
        function () {
            var color = $(this).css('background')
            $(this).css('background', '#D2DEE8');
        },
        function () {
            $(this).css('background', color);
        }
    );

誰かが私がこれを理解するのを手伝ってくれるか、IE8の行をホバリングするか交互にするかのどちらかを行うためのより簡単でより良い方法を提供してくれるなら、私はそれをいただければ幸いです！ありがとう！

4

4 に答える 4

3

行の色が異なる場合は、 ：oddと：evenを使用します。ホバー効果には：hoverを使用します。IE8でTestet。

javascript：

$(".DefaultTable tr:odd").css('background-color', '#EFEFEF');
$(".DefaultTable tr:even").css('background-color', '#FFFFFF');

css：

.DefaultTable tr:hover {
    background-color: #D2DEE8 !important;
}

この例も参照してください。

于 2011-12-30T19:01:13.483 に答える
1

color宣言を共通のスコープに移動する必要があります。

var color; //At this point, the `color` variable can be read by both functions
$(".DefaultTable tr").not(".DefaultTable .nohover").hover(
    function () {
        color = $(this).css('background')
        $(this).css('background', '#D2DEE8');
    },
    function () {
        $(this).css('background', color);
    }
);

より良いアプローチは、クラス名を使用することです。

CSS：

.special-color {
    background: #D2DEE8;
}

JavaScript：

$(".DefaultTable tr").not(".DefaultTable .nohover").hover(
    function () {
        $(this).addClass('special-color');
    },
    function () {
        $(this).removeClass('special-color');
    }
);
于 2011-12-30T18:51:00.003 に答える
1

私はゼブラカラーとマウスオーバーに次のコードを使用し、行の選択もこのコードはAjax呼び出しでも機能します...試してみてください

function rowHighlight(){        
    $(function(){
    $("#facCodes tr:odd").addClass('oddRow');
    $("#facCodes tr:even").addClass('evenEven');
    $('#facCodes tr').hover(function() {
          $(this).addClass('hover');
       },
       function() {
          $(this).removeClass('hover');
    });

});
 $('#facCodes tr').click(function(event){
    $(this).addClass("click").siblings().removeClass("click");
 });

}
于 2014-01-07T11:34:39.060 に答える
0

td同様のことをしようとすると、IEには透明な背景がないことがわかりました。

.DefaultTable tr td {background-color:transparent}

後継者の例のように

于 2011-12-30T19:05:55.650 に答える