Сын Suckerfish Menu IE6 - меню скрывается за контентом - PullRequest
3 голосов
/ 04 декабря 2009

Страница - http://blu -eye.com / index.html - содержит меню suckerfish, которое правильно отображается на остальной части сайта, за исключением этой страницы. Пункты меню скрыты за содержанием ниже.

Содержимое ниже содержит слайдер javascript с изображением и текстом. Я пытался изменить z-индексы для большинства элементов, но все еще не получилось.

Это происходит только в IE (6 и 7).

Пожалуйста, помогите!

Ответы [ 4 ]

2 голосов
/ 10 декабря 2009

Драма - это использование элементов с относительным расположением, которые сбрасывают контекст z-порядка в

В частности, в заголовке div # удалите относительную позицию. затем в div # cat_528463_divs> ul> li установить z-индекс (например, 1000). Это устранит проблему с навигацией, скрытую под слайдером JS - однако это испортит внешний вид остальной части верхней части, потому что они абсолютно позиционируют логотип и некоторые другие изображения. Так что это нужно будет восстановить.

1 голос
/ 04 декабря 2009

IE имеет несколько иной порядок расположения элементов, поэтому простая установка чего-либо с другим z-индексом не обязательно переместит его выше.

Взяв вашу отправную точку в качестве оболочки, добавьте позицию: относительно нее и затем углубитесь в ваш HTML. Если вы представляете себе это в начальной точке, то вам нужно, чтобы div вашего меню и div вашего слайдера, по крайней мере, имели одинаковую глубину.

Возможно, вы найдете добавочную позицию: относительно #content также может помочь.

Затем вы можете изменить z-индексы.

0 голосов
/ 07 декабря 2009

Я нашел этот бит jQuery очень удобным для вашей проблемы:

http://www.vancelucas.com/blog/fixing-ie7-z-index-issues-with-jquery/

0 голосов
/ 04 декабря 2009

Добавьте z-index:100 в li's подменю

#nav_528463 li ul li {
  -moz-background-clip:border;
  -moz-background-inline-policy:continuous;
  -moz-background-origin:padding;
  background:transparent none repeat scroll 0 0;
  float:none;
  margin:0;
  padding:0;
  z-index:100
}
...