Галерея изображений, выведенных в цикле

Web Backend: PHP, Node.js, ...
#1

Ребята, кто знает как можно сделать галерею, лайт-бокс или модальное окно для нескольких изображений, выведенных на страницу с помощью цикла? А именно: чтобы при клике на превью всплывало это изображение бОльшего размера и можно было листать от одного к другому или хотя бы просто закрывать его и открывать кликом следующее.

#2

Так вроде ж много готовых примеров и библиотек? Выбирайте и разбирайтесь )
https://www.google.com/search?q=php+lightbox

#3

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

#4

Так а как сделали это превью?

#5

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

#6

Ну дык очевидно ошибка в реализации, гадать без кода — сложно )

#7

цикл повторяет этот код

<div class="formNovFot">
						<a href="#formPredlRab" class="butObyjavl2">
							<img src="/Uploads/Photos_Open/<?php echo $result['image'] ?>" width="140px" height="210px"/>
								<div id="formPredlRab" class="Modal_photo">
									<div>
										<img style="border-radius: 5px" src="/Uploads/Photos_Open/<?php echo $result['image'] ?>" width="450px" height="auto"/>
										
											<a href="autor.php">
												<div class="title_photo">	
													<?php if(!empty($result['name_autor_img'])) echo $result['name_autor_img'] . ', ' ?>
													<?php if(!empty($result['age_autor_img'])) echo $result['age_autor_img'] . ', ' ?>
													<?php if(!empty($result['plas_obit_autor_img'])) echo $result['plas_obit_autor_img']; ?>
												</div>
											</a>	
										
						</a>	
										<a href="#close" title="Закрыть">Закрыть</a>
									</div>        
								</div>
							
						<a href="autor.php">
							<div class="overlay">	
								<?php if(!empty($result['name_autor_img'])) echo $result['name_autor_img'] . ', ' ?>
								<?php if(!empty($result['age_autor_img'])) echo $result['age_autor_img']; ?></br>
								<?php if(!empty($result['plas_obit_autor_img'])) echo $result['plas_obit_autor_img']; ?>
							</div>
						</a>		
					</div>
#9

Что-то тут не видно открытия окна. Оно ж из JS происходить должно.

И так неправильно делать в цикле

id должен быть уникальным на весь документ.

#10

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

#11

Потому что кнопку Код нажимать надо.

#12

Ура! Нужно в id записать уникальное значение, которое можно точно так же вытянуть из базы. Это может быть id изображения или просто даже его имя!