У меня есть слайд-шоу, которое накладывается поверх остальной части страницы с полупрозрачным фоном.
Вы можете выйти из слайд-шоу, нажав Esc , щелкнув значок X или щелкнув по самому фону.
При нажатии на фон в Firefox, онвыделяет весь HTML-код в дочернем элементе слайд-шоу <ul> (это можно увидеть, щелкнув правой кнопкой мыши и выбрав «Просмотреть источник выбора»).Если вы снова откроете слайд-шоу, слайд-шоу «подсвечивается» голубым цветом.
Этого не происходит в Chrome.
Слайд-шоу отображается «подсвеченным» голубым цветом:
«Просмотр источника выбора».Странно, что элемент <slideshow> является полупрозрачным фоном, но выбирается только дочерний элемент <ul> внутри, а не остальные дочерние элементы.
JS из Codrops Grid Gallery , но я добавил этот слушатель событий, чтобы закрыть слайд-шоу при нажатии на фон:
this.slideshow.addEventListener('click', function (event) {
if (event.target !== this) {
return;
}
event.stopPropagation();
self._closeSlideshow();
});
Вы можете увидеть его, например, на этой странице: https://ferret.photography/albums/stevie