0

マウスを使用するか、時限イベントによって選択されるタイルdivがあります。選択された状態と選択されていない状態は次のとおりです。

選択されていない

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

。選択された適用

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

.tile
{
    height: 70px;
    padding: 5px 10px 5px 10px;
    margin: 8px auto 0px auto;
    width: 280px;
    background-color: #99b433 !important;
    cursor: pointer;
}

.tile.selected
{
    border-left: 10px #2d89ef solid;
    width: 270px !important;
}

問題は、タイルをクリックしてcssを使用してクラスを適用すると、これは正常に機能することです。

// tile click handler
$('.tile').click(function () {
    $('#leftPane').children().removeClass('selected');
    $(this).addClass('selected');
});

しかし、これが15秒ごとにajax関数から呼び出された場合：

$('#' + selectedId).addClass('selected');

私は（クロムで）得る：

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

しかし、私がそれにカーソルを合わせるとすぐに、それは上記の.selected適用された写真に戻ります。

.tile:hover
{
    border: 2px solid #2d89ef;
}

この奇妙な行動について何か考えはありますか？私はIE10とSafariでテストしましたが、そこではテストしていません。

EDIT（ericの場合）autoを設定した後、幅全体を埋めると次のようになります。

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

4

2 に答える 2

-1

border-leftクラスから削除する.selectedと、必要なくなり!importantます。

.tile.selected
{
    width: 270px;
}

http://jsbin.com/izaxuh/10/edit

于 2013-02-01T16:55:03.470 に答える
-1

を持っているためwidth: 270px !important;、幅を に設定するautoと正常に動作します。

http://jsbin.com/izaxuh/14

于 2013-02-01T16:55:31.833 に答える