appendChild не работает правильно в IE - PullRequest
4 голосов
/ 23 июня 2011

Я пытаюсь создать простое модальное окно, но IE не сотрудничает. Когда я вызываю эту функцию в IE, содержимое отображается внизу страницы под всем содержимым, а оверлейное изображение не отображается. Вот код:

function applyOverlay(src)
{
  var my_overlay = document.createElement('div');

  my_overlay.setAttribute('id','myoverlay');
  var doc_height = document.body.scrollHeight;
  my_overlay.setAttribute('style','text-align:center; position:fixed; top:0px; left:0px; background-image:url("images/trbg.png"); width:100%; height:'+doc_height+'; z-index:999;');
  my_overlay.innerHTML="<iframe style='background:none;' frameborder=0 height='100%' width='80%' src='"+src+"'><iframe>";
  document.body.appendChild(my_overlay);
}

1 Ответ

3 голосов
/ 23 июня 2011

Это распространенная проблема IE. Это раздражает, но управляемо.

Если document.body.appendChild выполняется внутри тега body до закрытия тела, IE6 просто не загрузит страницу. 7 и 8 будут ждать загрузки страницы

Итак, как подойти к этому вопросу?

  • дождитесь загрузки тела, используя body.onload .
  • добавить элемент к другому элементу вместо тега body.

Я рекомендую второй вариант. Добавление элементов к другому целевому элементу сохранит намеченное поведение и не изменит способ добавления ваших элементов на сайт.

...