Всем привет
Я сделал небольшой пример для демонстрации странного поведения в IE8-9 —
afternoon-river-5822.herokuapp.com/
Есть две ссылки: одна открывает «быструю» страницу, вторая «медленную», т.е как будто для нее внутри производится какие-то вычисления.
Эти ссылки имеют по две картинки: одна для обычного состояния, вторая — когда наведен курсор мыши.
Проблема: в IE8-9 если нажать на «медленную» ссылку и увести курсор с кнопки, то индикатор загрузки браузера покажет, что загрузка страницы окончилась, однако через некоторое время все-таки появится новая (загружаемая) страница. При этом, если не уводить курсор с кнопки после нажатия, т.е картинка на кнопке не будет изменяться, то индикатор будет работать правильно (крутиться до полной загрузки новой страницы)
CSS.b-mainmenu li {
display: inline-block;
text-align: center;
vertical-align: top;
min-width: 58px;
height: 100px;
margin-right: -6px;
}
.b-mainmenu li a {
display: block;
font: bold 11px "Lucida Grande",tahoma,arial,sans-serif;
color: #5d5e5b;
min-width: 58px;
padding-top: 36px;
background-position: 50% 3px;
background-repeat: no-repeat;
margin-right: 3px;
margin-left: 3px;
}
.b-mainmenu li a:hover,
.b-mainmenu li.active a {
text-decoration: none;
color: #fff;
}
a {
display: block; width: 341px; height: 97px;
}
.b-mainmenu-fast {
background-image: url(/assets/menu-home.png);
}
.b-mainmenu-slow {
background-image: url(/assets/menu-backup.png);
}
.b-mainmenu-fast:hover {
background-image: url(/assets/menu-home_aa.png);
}
.b-mainmenu-slow:hover {
background-image: url(/assets/menu-backup_aa.png);
}
HTML<ul class="b-mainmenu">
<li><a class="b-mainmenu-fast" href="page/fast_page">Fast page</a></li>
<li><a class="b-mainmenu-slow" href="page/slow_page">Slow page</a></li>
</ul>
Как можно обойти это? Или доказать, что это проблема в IE и с этим ничего нельзя сделать?
Простой