CSS: активный работает неправильно на элементе <a>в IE9 - PullRequest
Новая
       18

CSS: активный работает неправильно на элементе <a>в IE9

0 голосов
/ 26 марта 2012

Я делаю сайт с использованием HTML и CSS, и мне нужна стрелка, которая будет отображать «анимацию» при нажатии и активировать Javascript.

Вот соответствующий фрагмент кода: 

<table>
    <tr>
        <td class="td_bezIvice">
            <a id="slevo" href="javascript:levo()"> <img src="left.png" width="60" alt="стрелица лево"/></a>
        </td>

        <td>
            <table>
                <tr>
                    <td class="gal"><img id="leva" src="blank.jpg" alt="лева слика"></td>   <td class="gal"><img id="srednja" src="blank.jpg" alt="средња слика"></td>  <td class="gal"><img id="desna" src="blank.jpg" alt="десна слика"></td>
                </tr>

            </table>
        </td>
        <td class="td_bezIvice">
            <a id="sdesno" href="javascript:desno()">   <img src="right.png" width="60" alt="стрелица десно"/> </a>
        </td>

    </tr>

</table>

Интерес представляют здесь <a> с id = "slevo" и <a> с id = "sdesno"

Вот их CSS: 

#slevo
{
    display:block;
    height:51px;
    width: 60px;
    border: 10px outset gray;
}

#slevo:active
{
    display:block;
    height:51px;
    width: 60px;
    border: 10px inset gray;
}


#sdesno
{
    display:block;
    height:51px;
    width: 60px;
    border: 10px outset gray;
}

#sdesno:active
{
    display:block;
    height:51px;
    width: 60px;
    border: 10px inset gray;
}

В других браузерах, когда я нажимаю стрелку, граница изменяется от начала до вставки, что обеспечивает визуальную обратную связь.Однако в IE 9 не происходит никаких изменений в стиле границ.Стиль границы также выглядит не так, как в Firefox, Opera и Chrome.

Как это исправить?

ОБНОВЛЕНИЕ: Я провел некоторые эксперименты с режимом совместимости IE9 и заметил,что, когда он включен, и я нажимаю на стрелку, граница меняется на вставку, пока я не нажму на другое место, когда она вернется к началу.С другой стороны, в режиме совместимости JavaScript, который вставляет изображения с сервера во внутреннюю таблицу, не работает.Я использую цикл do while для добавления изображений в массив и проверяю naturalHeight на ноль, чтобы увидеть конец, а высота определяется равной нулю, хотя элемент массива имеет более высокий NaturalHeight, когда я проверяю его в режиме F12.

1 Ответ

2 голосов
/ 26 марта 2012

Убедитесь, что вы установили тип документа, чтобы IE отображал документ в стандартном режиме.Я предполагаю, что расхождения, которые вы видите между другими браузерами и IE9, являются результатом того, что IE использует режим причуд.

...