CSS: Как я могу остановить горизонтальные навигационные ссылки, которые просвечивают сквозь плавающую тележку, когда она опущена вниз?

Question

CSS: Как я могу остановить горизонтальные навигационные ссылки, которые просвечивают сквозь плавающую тележку, когда она опущена вниз?

0

Взгляните на http://www.StringOfJewels.com

На домашней странице есть слайд-шоу. Он работает с использованием JavaScript для увеличения z-индекса содержащихся DIV, в котором находится каждый слайд, поэтому, если кто-то долгое время задерживается на главной странице, слайды могут перелезать через вылет с горизонтальной навигационной панели продукта и когда отображается. Чтобы справиться с этим, я произвольно устанавливаю UL, который формирует навигационную панель продукта для z-индекса 20000000 (20 миллионов). Да, наверное, чрезмерно, но зачем рисковать? Я установил контейнер.smb-fc.yui-panel

<div id="yfc_fc-panel" class="yui-module yui-overlay 
yui-panel" style="visibility: inherit; width: 324.155px;">

для свернутой плавающей тележки (нажмите "Ваша корзина покупок", чтобы развернуть плавающую тележку) до z-индекса 21000000. Но ссылки в горизонтальной навигационной панели светят прямо через плавучую тележку, когда она отображается.

Как я могу загрузить плавучую тележку на аккордеон вниз по меню навигации? Я не могу добавить локальные стили, потому что плавающая тележка написана JavaScript на сервере, к которому у меня нет доступа. (Это магазин Yahoo!). Все, что я могу сделать, это настроить CSS плавающей тележки.

James Hollomon 14 март 2014, в 03:15

Источник

Теги:

html

css

1 ответ

Ещё вопросы

davidpauljunior · Accepted Answer · 2014-03-14T00-28-00.000Z

<div> который вы установили для z-index 210000000, находится внутри div (.smb-fc), который имеет z-индекс 9999. Вам нужен родитель, чтобы иметь более высокий индекс z, чем навигация. Не имеет значения, насколько высок детский z-индекс, он по-прежнему сидит за навигацией.

Так...

.smb-fc {
  z-index: 21000000;
  left: 595px;
  font-family: Arial;
  color: #000;
}

Благодарю. Yahoo! никогда не облегчает жизнь Этот класс даже не отображается в редакторе, где я его устранял. Но я нашел еще более простое решение. В любом случае UL, в котором создается верхняя навигация, находится над слайдами. Это не должно быть на высоком z-index. Я уронил его на пол и поднял только те UL в нем, которые образуют спуски. Когда F-cart развернута, псевдокласс Hover никогда не запускается, потому что горизонтальная навигация теперь безопасно находится ниже плавающей корзины.
Да, в прошлом работа с YUI была довольно тяжелой. Рад, что вы решили это.