https://victor-victrola.com/lightbox.js

1(function () {
2  function buildOverlay() {
3    var overlay = document.createElement('div');
4    overlay.className = 'lightbox-overlay';
5    overlay.id = 'lightbox-overlay';
6
7    var closeBtn = document.createElement('button');
8    closeBtn.className = 'lightbox-close';
9    closeBtn.setAttribute('aria-label', 'Close');
10    closeBtn.innerHTML = '×';
11
12    var img = document.createElement('img');
13    img.id = 'lightbox-img';
14    img.alt = '';
15
16    overlay.appendChild(closeBtn);
17    overlay.appendChild(img);
18    document.body.appendChild(overlay);
19
20    function close() {
21      overlay.classList.remove('open');
22    }
23
24    closeBtn.addEventListener('click', close);
25    overlay.addEventListener('click', function (e) {
26      if (e.target === overlay) close();
27    });
28    document.addEventListener('keydown', function (e) {
29      if (e.key === 'Escape') close();
30    });
31
32    return { overlay: overlay, img: img };
33  }
34
35  document.addEventListener('DOMContentLoaded', function () {
36    var lb = buildOverlay();
37
38    document.addEventListener('click', function (e) {
39      var link = e.target.closest('a.diagram-img-link');
40      if (!link) return;
41      e.preventDefault();
42      lb.img.src = link.getAttribute('href');
43      lb.overlay.classList.add('open');
44    });
45  });
46})();