Фоторама прозрачный фон

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

Чтобы понять, что я имею в виду, перейдите по этой ссылке и откройте одно из изображений в небольшом слайдере на весь экран.

Я попытался изменить весь фон в слайдере на следующее:

background: rgba{0,0,0,0);

2 ответа

Решение

Это возможно - я сам понял это с помощью следующего кода:

.fullscreen .fotorama--fullscreen {
    background: transparent !important;
}

.fullscreen .fotorama__wrap {
    background: rgba(0,0,0,0.7) !important;
}

.fullscreen .fotorama__img {
    top: 0px !important;
    width: 50% !important;
    height: auto !important;
    margin: auto !important;
    left: 0px !important;
}

Это об этой части кода:

.fotorama--fullscreen .fotorama__nav, .fotorama--fullscreen .fotorama__stage {
    background: #000;
}

Но вы не можете установить его на прозрачный, вы можете установить его на белый. Или вы можете добавить конкретное изображение вместо.

РЕДАКТИРОВАТЬ

Вы не можете установить его прозрачным, потому что вы входите в полноэкранный режим, и по умолчанию фон установлен на черный. Вы можете изменить этот цвет на любой цвет, который вы хотите, но вы никогда не увидите содержание своего сайта таким образом.

Смотрите этот пост на SO:

Фон / элемент становится черным при входе в полноэкранный режим с HTML5

Другие вопросы по тегам