Любое решение для ошибки отображения ошибок IE8 при скрытии элементов? - PullRequest
2 голосов
/ 08 июня 2010

Ошибка: при скрытии элемента с JavaScript в IE8, поле все еще видимых других элементов на странице игнорируется.

Эта ошибка была введена в IE8, так как она работает, как и ожидалось в IE6 +7 (и другие браузеры).

<html>
<head>
    <style>
        #a, #b, #c, #d {background: #ccf; padding: 4px; margin-bottom: 8px;}
    </style>
</head>
<body>
    <div id="a">a</div>
    <div id="b">b</div>
    <div id="c">c</div>
    <div id="d">d</div>
    <script>
        setTimeout(function () {
            document.getElementById("b").style.display = "none";
        }, 1000);
    </script>
</body>
</html>

При запуске этого кода обратите внимание на то, что a и c имеют отступ между ними в обычных браузерах, равный 8, но в IE8 - 0.1008 *

  • Удалите заполнение, и IE8 ведет себя как обычно.
  • Удалите тайм-аут, и IE8 будет работать как обычно.
  • Граница ведет себя так же.

Я работаю с ошибками IE последние 10 лет, но это поставило меня в тупик.На данный момент решение состоит в том, чтобы обернуть элементы div и применить поле к внешнему элементу, а другие стили - к внутреннему.Но это напоминает ужасные обходные пути IE6.

Есть ли лучшие решения?

Редактировать: Я отправил заявку в команду IE9, и теперь ошибка исправленав IE9.Надеюсь, они также перенесут его в IE8.

Ответы [ 2 ]

1 голос
/ 08 июня 2010

Это меня поставило в тупик для истинного исправления.Для хакерского обходного пути вы можете просто сбросить значение marginBottom до 8px.Видимо, настройка отображения: ни один не удаляет поле.Чтобы проверить, попробуйте:

    setTimeout(function () {
        document.getElementById("b").style.display = "none";
        document.getElementById("a").style.marginBottom="8px";
    }, 1000);
0 голосов
/ 08 июня 2010

Улучшение решения edl может заключаться в автоматическом выборе и применении margin-bottom из предыдущего элемента.Таким образом, вам не придется выбирать (и помнить) идентификатор элемента и назначенное поле.

setTimeout(function () { 
    var e = document.getElementById("b");
    e.style.display = "none";

    var prevSibling = e.previousSibling;
    prevSibling.style.marginBottom = prevSibling.currentStyle.marginBottom;
}, 1000); 

Возможно, вам придется проверить, существует ли предыдущий элемент / является ли он частью ошибки.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...