Как сделать при наведении блок поверх других?

Question

[s0pran0]

Разрабатываю сайт vianni.ru , в карточке товара при наведении появляются характеристики и кнопки, но они заезжают под следующий блок. Как сделать чтобы они поверх открывались? сами карточки находятся в owl-carousel и не выходят за рамки.

Comments

[Ankhena]

У карусели overflow hidden и она обрезает всё, что пытается из нее вывалится.
Значит доп блоки нужно показывать поверх карточки, а не вниз.

[s0pran0]

Ankhena, что? вот это не понял

Значит доп блоки нужно показывать поверх карточки, а не вниз.

Мне же наоборот нужно показывать карточку полностью, но чтобы она вылезала за пределы owl-carousel и поверх блока "Хиты продаж"

[Ankhena]

s0pran0, значит, нужно увеличить высоту owl на высоту выпадения блоков с инфо.
Блок с хитами продаж подвинуть наверх отрицательным margin.

[s0pran0]

Делал, но тогда другая проблема, owl перекрывает блок "хиты продаж" и карточки не реагируют при наведении

[Ankhena]

s0pran0, меняйте z-index
При наведении на карточки товара снова меняйте z-index (на js).

[s0pran0]

Понять бы ещё, как это сделать)))

[Ankhena]

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

[Ankhena]

s0pran0,

Понять бы ещё, как это сделать)))

Повесить отслеживалку события ховера на карточку
https://learn.javascript.ru/mousemove-mouseover-mo...

С помощью classList добавлять или убирать класс (или 2 класса, по отдельности на карусель и на карточку), который будет менять z-index.

Answer 1

[Sagrana]

У вас эти карточки лежат в блоке .owl-stage-outer, у которого стоит overflow: hidden;
Если вы уберете у этой карусели у .owl-carousel margin-bottom, и добавите padding-bottom нужного размера для .owl-stage-outer, то карточки не будут обрезаться.

Answer 2

[Рей Достоевский]

Не уверен, но возможно может помочь
z-index. Примени к выпадающей информации 1, а к блоку 0. Опять-же, не уверен.

Comments

[s0pran0]

Нет, z-index тут не действует, это было одно из первого что пришло на ум, но нет(((