Как добавить эффект наведения к изображениям товаров в теме bigcartel аккуратный

Я хотел бы создать эффект наведения на изображения моих продуктов, который переключается на второе изображение следующим образом:

.product-img-wrapper img:last-of-type {
position: absolute;
top: 0;
left: 0;
opacity: 0;
visibility: hidden;
z-index: 1;
-webkit-transition: all .25s ease-in-out;
-o-transition: all .25s ease-in-out;
-moz-transition: all .25s ease-in-out;
transition: all .25s ease-in-out;
}

Что мне нужно добавить в мой код и куда я должен его поместить? Я использую тему Neat от bigcartel.

Спасибо!


html css hover bigcartel
person SAC Studio    schedule 03.02.2021    source источник

Ответы (1)


arrow_upward
0
arrow_downward

То, что вы написали, является начальным состоянием. Не уверен, что вы хотите, чтобы произошло при зависании. Предположим, вы хотите, чтобы зависшее состояние изображения было видимым. Код будет:

.product-img-wrapper img:last-of-type:hover {
    opacity: 1;
    visibility: visible;
}
person Eneas Marín    schedule 03.02.2021