aタグ、divタグを使わずに、imgタグだけで画像をポップアップする方法

  /*画像popup*/
  #popup-container { display: none; position: fixed; background: rgba(0, 0, 0, 0.6); top: 0; bottom: 0; left: 0; right: 0; z-index: 99; }
  #popup-container > div { display: flex; height: 100vh; justify-content: center; align-items: center; }
  #popup-container > div > img { max-width: calc(100vw - 30px); max-height: calc(100vh - 30px); }
  img.popup { cursor: pointer; }

拡大したい画像にcssを指定

<img class="popup" src="img/photo1.jpg">

どこでもいいので設置　srcの中は空でok

<div id="popup-container">
	<div><img src=""></div>
</div>

フッター付近に設置（jqueryなし）

const modal = document.getElementById('popup-container');
const img = modal.querySelector('img');
modal.addEventListener('click', () => modal.style.display = 'none');
/* document自体をclickイベント監視、targetがpopup対象なら以降の処理を行う例 */
document.addEventListener('click', e => {
  if(!e.target.classList.contains('popup')) return;
  img.src = e.target.src;
  modal.style.display = 'block';
});