Javascript drop down Menu over Image Rotator

Question

Дизайнер здесь, пытаясь ввести код.

Я почти здесь! Попытка получить выпадающее меню из динамического диска для работы с ротатором изображений jQuery. Играется с z-индексом. Я могу заставить меню работать над вращением изображения во всех браузерах, кроме режима совместимости с IE, не могу нажимать на кнопки в ротаторе.

http://local495.bigrigmedia.com/

Любая помощь будет принята с благодарностью!

Answer 1

Всегда намного проще получить все, что нужно прямо в Photoshop, а? Вы можете устранить проблему перекрытия с 2-мя небольшими ухищрений с CSS:

styles.css

#top { 
    position: relative; 
    z-index: 2; 
    height: 155px; 

} 

ddsmoothmenu.css

.ddsmoothmenu{ 
    position: relative; 
    z-index: 2; 
    /* remaining css */ 
} 

homerotation.css

div#feature_list { 
    position: relative; 
    z-index: 1; 
    /* remaining css */ 
} 

Я также заметил, что у вас было много z-index: -100, посыпанное вокруг вашего CSS. Это также вызовет у вас проблемы. Я бы предложил взять их все и просто использовать вышеуказанные 2 изменения.

Что вышеприведенные правила 2 устанавливают порядок укладки для меню и поворота изображения таким образом, что все браузеры (включая наш друг IE) понимает.

Фокус с IE при использовании z-index заключается в том, чтобы убедиться, что все элементы, которые вы пытаетесь пересечь, находятся в одном и том же контексте стекирования. IE создает новый контекст стекирования, когда вы используете относительную, абсолютную или фиксированную позицию для элемента. В нашем случае выше мы устанавливаем порядок стекирования в верхней части большинства элементов в контексте стекирования (т. Е. Документ), поэтому он будет соблюдаться.

Редактировать

Добавлен г-индекс к #top контейнера, как это на самом деле <div> это на том же уровне, в документе как <div id="feature_list">.