ижний DIV реагирует на события поступающие от, DIV'а лежащего выше bug в IE6,7
Эффект или баг наблюдается только в IE 6 и 7 (Opera, FF, Safari все OK)
Суть такая, если поводить мышкой над сереньким слоем(DIV#outerFrame), то ровно в тот момент когда она достигнет уровня розового слоя (DIV#contentsInner) мы увидим alert, что неверно потому что непосредственно на розовый слой мышка не заезжает. Второе, если раскомменитровать объявление цвета фона для слоя DIV#innerFrame, то по какой-то магической и необъяснимой причине сей баг пропадет, но только "для" DIV#innerFrame (не знаю как правильно описать, попробуйте просто раскоментить CSS и повторить эксперимент) <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML Strict//EN"> <HTML> <HEAD> <META http-equiv="Content-Type" content="text/html; charset=utf-8"> <STYLE> #page { BACKGROUND-COLOR: pink; } #mainOrder { LEFT: 217px; FLOAT: left; WIDTH: 635px; Z-INDEX: 100; } #outerFrame { BACKGROUND-COLOR: #DDDDDD; } #innerFrame { WIDTH: 575px; HEIGHT: 100px; BORDER: 1px solid black; /* BACKGROUND-COLOR: olive; */ } </STYLE> <script type="text/javascript"> window.onload = function() { var contObj = document.getElementById("contentsInner"); contObj.onmouseover = function() { alert("Чихаю"); }; }; </SCRIPT> </HEAD> <BODY id="body"> <DIV id="mainOrder"> <DIV id="outerFrame"> <DIV id="innerFrame"></DIV> </DIV> </DIV> <DIV id="page"> <DIV id="contentsInner">Аллергик</DIV> </DIV> </BODY> </HTML> Обратите внимание, что объявление BORDER в CSS стиле для DIV#innerFrame никак не сказывается, а BACKGROUND-COLOR исправляет баг, хотя только для DIV#innerFrame Буду крайней степени благодарен тому кто сможет пояснить как избавиться от такой назойливой реакции в IE, заранее огромное спасибо! |
#page { … margin: 0 0 0 635px; … } |
Octane, ну это все-таки хакерский прием. И он крайне неудобен когда положение DIV#outerFrame изменяется динамически
В моем случае сложность в том, что это упрощенный случай. Мой оригинальный CSS код куда более сложен и там вот так просто изменять margin нижележащего слоя не получиться |
Ну а что вы хотите? CSS-свойство "disableIEFloatingBugs" или что? Есть баг, есть множество вариантов его обхода, верстайте с учетом этого.
Да и не все, что не работает в ИЕ, но работает в других браузерах, есть баг. Вообще вполне логичное поведение всплывания событий, если бы сдвинутый вправо блок (без margin) превышал по высоте блок с float: left; то ожидалось бы, что события всплывают именно таким образом. На деле не знаю, как это будет происходить, надо попробовать... Ну а в JavaScript можно проверять target/srcElement и выводить сообщение в нужном случае. |
Верстать ДИВами и не позаботится о позиционировании (position) или отображении (display)!? Это пример, как не надо делать.
В разных браузерах эти свойства ведут себя по разному, поэтому для MSIE нужно дополнительные разъяснения. В скрипте из вашего листинга, Royan, я заметил пустую строку. Попробуйте воткнуть туда следущее: if (navigator.appName == "Microsoft Internet Explorer") contObj.style.display="inline-block"; Впрочем, задать отображение этого объекта можно и в другом месте. |
Это к чему вообще?
|
Цитата:
|
Часовой пояс GMT +3, время: 08:21. |