Я использую jQuery для затухания в элементе <article>
, который содержит элемент <section>
.
Внешний элемент - display:none
, position:fixed
и z-index:5
.Внутренний элемент - position:absolute
.
В основном статья дает рамку, а внутренний раздел содержит содержимое и имеет полосу прокрутки.
Я исчезаю во внешнем элементе и ожидаю, что внутренняя частьследуйте его примеру.
В IE9 +, FF и Chrome он работает как положено.
В IE8 - нет.Внешняя статья не исчезает вообще - остается невидимой, а внутренняя часть располагается относительно рамки браузера и всегда видна.Все остальные элементы на странице перекошены, и страница в основном перестает функционировать.
Примеры кода:
article
{
display: none;
position: fixed;
z-index: 5;
}
section
{
position: absolute;
top: 10px;
right: 10px;
bottom: 10px;
left: 10px;
overflow: auto;
}
и
<!doctype html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<article id="contentFrame">
<section id="content">
Lorem Ipsum
</section>
</article>
</body>
</html>
и
$("#contentFrame").fadeIn(2000);