Форум

garmoni · #1 (**permalink**) 22.05.2018, 15:19

Вопрос необычный. На сайте для картинки нужно сделать открывающуюся картинку при клике. Но проблема в том, что картинка на которую нужно сделать ссылку не понятно как формируется.
Есть <div class="ad-image-wrapper"></div>
но в нем пусто. В инспекторе показывает в нем есть <img src="images/for_man/1/1.jpg" width="375" height="338">

как она создается не пойму. Нет ни файлов js ни в коде нет script

Можно как то с помощью JS или jQuery задать чтобы к <div class="ad-image-wrapper"></div> находя в нем images/for_man/1/1.jpg присваивалось

<a href="images/for_man/1/1_big.jpg " data-lightbox="image-1" data-title="My caption">
<div class="ad-image-wrapper"></div>
</a>

j0hnik · #2 (**permalink**) 23.05.2018, 04:34

Сообщение от garmoni

Нет ни файлов js ни в коде нет script

видимо что-то есть

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
</head>
<body>

	<div class="ad-image-wrapper">
		<img src="images/for_man/1/1.jpg" alt="img">
	</div>
	<div class="ad-image-wrapper">
		<img src="images/for_man/1/2.jpg" alt="img">
	</div>
	<script>
		$('.ad-image-wrapper').has('img').each(function(){
			var src = $(this).find('img').attr('src').replace(/\.jpg/, '_big$&');
			$(this).wrap( '<a href="'+src+'" data-lightbox="image-1" data-title="My caption"></a>');
		});
	</script>
</body>
</html>

j0hnik · #3 (**permalink**) 23.05.2018, 04:40

скрипт разместите перед </body> или оберните в

$(function(){
//код
})

;

если не сработает ищите подгруздку изображений аяксом, код запускайте колбеком.

Nexus · #4 (**permalink**) 23.05.2018, 09:17

Еще можно отследить изменение блока, в котором должно появляться изображение с помощью MutationObserver.
Также можно каждые несколько миллисекунд проверять в блоке наличие изображения до момента его появления.

Форум

Справочник

Discord чат

Курсы javascript