Есть ли в JS/jQuery способ "заблокировать" загрузку определенных изображений в DOM до наступления определенного события?

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

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

Ответы (2)

Вы можете добавить элемент img в модальное окно без атрибута src и обновлять атрибут src в зависимости от выбора продукта.

Здесь Pen демонстрирует идею :)

.

Удовлетворительным способом достижения того же конечного результата является саботаж атрибута src изображений, а затем восстановление этого атрибута с помощью JS.

Найдено на https://stackoverflow.com/a/5402812/871404 (спасибо @arkantos тоже!)

2022 WebDevInsider