исчезать не сфокусированные изображения в полноэкранном режиме

Question

Я использую flickity для своего портфолио любительских фотографий и хотел бы, чтобы полноэкранный вариант вел себя больше как лайтбокс - по существу, выцветание изображений до и после центрального изображения.

Я использую базовый пример полноэкранного кода , и мне интересно, есть ли селектор css для ячеек до и после текущей ячейки, где я мог бы установить прозрачность напочти 0, или добавьте темный оверлей или что-то подобное, чтобы центральное изображение выскочило и не отвлекало его от просмотра в полноэкранном режиме.Любые советы?

Answer 1

Не берите в голову, я играл с .is-selected, и, кажется, следующее помогает,

.carousel.is-fullscreen .carousel-image {
  height:90%;
  object-fit: contain;
  max-width: 90%;
  max-height: 90%;
 opacity: 0.2;
}

.carousel.is-fullscreen .is-selected{
 opacity: 1;
}