Плагин Lightbox (увеличение изображения) на чистом JavaScript. Адаптивный

<link rel="stylesheet" href="dist/css/glightbox.css">
<script src="dist/js/glightbox.min.js"></script>

или CDN

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/glightbox/dist/css/glightbox.min.css">
<script src="https://cdn.jsdelivr.net/gh/mcstudios/glightbox/dist/js/glightbox.min.js"></script>
<script type="text/javascript">
    const lightbox = GLightbox({ ...options });
</script>

<!-- Simple image -->
<a href="large.jpg" class="glightbox">
    <img src="small.jpg" alt="image">
</a>

<!-- Video -->
<a href="https://vimeo.com/115041822" class="glightbox2">
    <img src="small.jpg" alt="image">
</a>

<!-- Gallery -->
<a href="large.jpg" class="glightbox3" data-gallery="gallery1">
    <img src="small.jpg" alt="image">
</a>
<a href="video.mp4" class="glightbox3" data-gallery="gallery1">
    <img src="small.jpg" alt="image">
</a>

<!-- Simple Description -->
<a href="large.jpg" class="glightbox4" data-glightbox="title: My title; description: this is the slide desciption">
    <img src="small.jpg" alt="image">
</a>

<!-- Advanced Description -->
<a href="large.jpg" class="glightbox5" data-glightbox="title: My title; description: .custom-desc1">
    <img src="small.jpg" alt="image">
</a>
<div class="glightbox-desc custom-desc1">
    <p>The content of this div will be used as the slide description</p>
    <p>You can add links and any HTML you want</p>
</div>