#javascript #jquery #css #image
#javascript #jquery #css #изображение
Вопрос:
Я наткнулся на этот сайт http://skincity.se/sv/product/1198/md-formulations-vit-a-plus-hand-body-creme и хотел скопировать то, как они удалили цвет фона с изображений продуктов. Как они это делают? Кажется, они делают это на интерфейсе, поскольку все изображения имеют белый цвет фона…
Комментарии:
1. Вы имеете в виду черный верхний и нижний колонтитулы, которые «плавают» над изображениями? Если это так, то, вероятно, это делается с помощью простой установки высокого zindex и абсолютной позиции в CSS.
Ответ №1:
Они помещают полупрозрачное наложение поверх изображения. Посмотрите их CSS:
#primary-image-node-overlay {
background-color: black;
opacity: 0.08;
filter: alpha(opacity = 8) !important;
}
Ответ №2:
Я думал, что вы были правы насчет JavaScript, пока я не попытался отключить его и обновить страницу — если вы попробуете это, вы обнаружите, что эффект сохраняется.
На самом деле это какой-то CSS-трюк. Сероватый фон на самом деле находится над изображением — он имеет черный фон с непрозрачностью 0,08. Кажется, что это серый фон, хотя на самом деле это полупрозрачный передний план.
Надеюсь, это поможет!