Z-индекс, прерванный IE8?
Структуры являются типами значения, что означает, что они копируются, когда они розданы.
Поэтому при изменении копии, Вы изменяетесь только, что копия, не оригинал и не любые другие копии, которые могли бы быть вокруг.
, Если Ваша структура неизменна затем, все автоматические копии, следующие из того, чтобы быть переданным значением, будут тем же.
, Если Вы хотите изменить его, необходимо сознательно сделать это путем создания нового экземпляра структуры с измененными данными. (не копия)
4 ответа
Простой ответ - добавить значение z-index , которое больше, чем значение .thumbnail: hover , в состояние наведения span .
.thumbnail:hover span{ /*CSS for enlarged image on hover*/
visibility: visible;
top: -140px; /*position where enlarged image should offset horizontally */
left: -500px;
z-index: 51;
}
Если я вас правильно понял, вы хотите, чтобы диапазон отображался над элементом, отмеченным как эскиз. Вы не указали z-index для элемента span . Вот рабочий пример:
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=UTF-8" />
<title>Pop-up Test</title>
<style type="text/css">
#vbox {
border: 1px solid black;
height: 200px;
position: relative;
width: 200px;
z-index: 0;
}
#vbox:hover #hbox {
display: block;
}
#hbox {
border: 1px solid blue;
display: none;
height: 200px;
left: 50px;
position: relative;
top: 50px;
width: 200px;
z-index: 1;
}
</style>
</head>
<body>
<div id="vbox">
<p>Hover over this box to show a hidden "pop-up".</p>
<p id="hbox">This box is a pop-up.</p>
</div>
</body>
</html>
Способ исправления этой проблемы заключается в добавлении класса к изображению миниатюры, как например:
.thumbnail:hover img.thumb {z-index:-50; position:relative;}
Поместите эти строки в заголовок страницы.
<!--[if IE]>
<style>
#your_faulty_div{
background-color:#000; /*any color it doesn't matter*/
filter: alpha(opacity=0);
}
</style>
<![endif]-->
your_faulty_div - это div, который работает неправильно из-за ошибки z-индекса IE.
Работает плавно, я использую его во всех своих проектах, где у меня элементы перекрываются.