Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 21.12.2008, 12:45
Новичок на форуме
Отправить личное сообщение для Royan Посмотреть профиль Найти все сообщения от Royan
 
Регистрация: 21.12.2008
Сообщений: 4

ижний 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, заранее огромное спасибо!
Ответить с цитированием
  #2 (permalink)  
Старый 21.12.2008, 13:47
Отправить личное сообщение для Octane Посмотреть профиль Найти все сообщения от Octane  
Регистрация: 10.07.2008
Сообщений: 3,873

#page {
…
margin: 0 0 0 635px;
…
}
Ответить с цитированием
  #3 (permalink)  
Старый 21.12.2008, 14:15
Новичок на форуме
Отправить личное сообщение для Royan Посмотреть профиль Найти все сообщения от Royan
 
Регистрация: 21.12.2008
Сообщений: 4

Octane, ну это все-таки хакерский прием. И он крайне неудобен когда положение DIV#outerFrame изменяется динамически

В моем случае сложность в том, что это упрощенный случай. Мой оригинальный CSS код куда более сложен и там вот так просто изменять margin нижележащего слоя не получиться
Ответить с цитированием
  #4 (permalink)  
Старый 21.12.2008, 14:50
Отправить личное сообщение для Octane Посмотреть профиль Найти все сообщения от Octane  
Регистрация: 10.07.2008
Сообщений: 3,873

Ну а что вы хотите? CSS-свойство "disableIEFloatingBugs" или что? Есть баг, есть множество вариантов его обхода, верстайте с учетом этого.

Да и не все, что не работает в ИЕ, но работает в других браузерах, есть баг. Вообще вполне логичное поведение всплывания событий, если бы сдвинутый вправо блок (без margin) превышал по высоте блок с float: left; то ожидалось бы, что события всплывают именно таким образом. На деле не знаю, как это будет происходить, надо попробовать...
Ну а в JavaScript можно проверять target/srcElement и выводить сообщение в нужном случае.

Последний раз редактировалось Octane, 21.12.2008 в 14:59.
Ответить с цитированием
  #5 (permalink)  
Старый 21.12.2008, 23:59
Интересующийся
Отправить личное сообщение для PavelPetrov Посмотреть профиль Найти все сообщения от PavelPetrov
 
Регистрация: 06.12.2008
Сообщений: 20

Верстать ДИВами и не позаботится о позиционировании (position) или отображении (display)!? Это пример, как не надо делать.
В разных браузерах эти свойства ведут себя по разному, поэтому для MSIE нужно дополнительные разъяснения.
В скрипте из вашего листинга, Royan, я заметил пустую строку. Попробуйте воткнуть туда следущее:
if (navigator.appName == "Microsoft Internet Explorer") contObj.style.display="inline-block";

Впрочем, задать отображение этого объекта можно и в другом месте.
Ответить с цитированием
  #6 (permalink)  
Старый 22.12.2008, 00:13
Отправить личное сообщение для Octane Посмотреть профиль Найти все сообщения от Octane  
Регистрация: 10.07.2008
Сообщений: 3,873

Это к чему вообще?
Ответить с цитированием
  #7 (permalink)  
Старый 22.12.2008, 12:40
Новичок на форуме
Отправить личное сообщение для Kolyaj Посмотреть профиль Найти все сообщения от Kolyaj
 
Регистрация: 19.02.2008
Сообщений: 9,177

Сообщение от PavelPetrov
Royan, я заметил пустую строку. Попробуйте воткнуть туда следущее
Это пять. PavelPetrov, у меня в скриптах непозволительно-большое количество пустых строк. Остаются иногда после рефакторинга. Не знаю, что с ними делать. Что посоветуете туда воткнуть?
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск