0

私は次のものを持っています：

table.inactiveTable thead {
    background: #efe;
    background: -moz-linear-gradient(top,#efe,#ded);
    background: -webkit-gradient(linear,0% 0,0% 100%,from(#efe),to(#ded));
    filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0,startColorstr=#efe,endColorstr=#ded);
    height: 40px;
}

table.inactiveTable th:hover {
    background: -moz-linear-gradient(top,#efe,#F8FFB5);
    background: -webkit-gradient(linear,0% 0,0% 100%,from(#efe),to(#F8FFB5));
    filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0,startColorstr=#efe,endColorstr=#F8FFB5);
    cursor : pointer;
}

次に、実行時ascにその要素のクラスを追加します。スタイルは次のとおりです。

.asc, .asc:hover{
    background-image: url(arrow_up.png);
    background-repeat: no-repeat;
    background-position : left;
}

それは機能します-つまり、背景に正しい画像があります。しかし、それはホバーイベントで消えます-th:hover動作します。

ascつまり、これはクラスを追加したときに表示されるものです。

ここに画像の説明を入力してください

そして、これは私がこの要素をホバーしたときに私が得るものです：

ここに画像の説明を入力してください

どうすればそれらを一緒に機能させることができますか？グラデーションの色を変更しながら、イネージを維持することを意味しますか？

私の目標は、クリックイベントで特定の（テーブル列ヘッダー）要素の背景画像を追加できるようにすることですが、ホバーでこの画像を失うことはありません。

追加した：

html：

<table id='leads' class='inactiveTable'>
    <thead>
        <tr>
            <th rowspan='2' onclick="sorter.sort(this, 'unumber')">id</th>
            <th rowspan='2' onclick="sorter.sort(this, 'bccu')">bccu</th>
...
4

1 に答える 1

1

追加-

.inactiveTable th.asc, .inactiveTable th.asc:hover{
    background: url(arrow_up.png) no-repeat left top;
}

それが動作します

于 2012-07-04T07:03:01.157 に答える