viewerjs 图片预览插件

CDN 方式：

<!-- 引入样式 -->
<link href="https://cdnjs.cloudflare.com/ajax/libs/viewerjs/1.11.6/viewer.css" rel="stylesheet">
<!-- 引入脚本 -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/viewerjs/1.11.6/viewer.js"></script>

🚀 基本使用

1. 原生 JavaScript，最基础的用法是将容器内的所有 元素初始化为画廊。

<!-- HTML 结构 -->
<div id="gallery">
  <img src="//cdn.myxypt.com/78f1f8ba/26/04/1fc2a3fdcd2d2c35783ea678ca8152442907aaea.jpg" alt="图片1">
  <img src="//cdn.myxypt.com/78f1f8ba/26/04/1fc2a3fdcd2d2c35783ea678ca8152442907aaea.jpg" alt="图片2">
  <img src="//cdn.myxypt.com/78f1f8ba/26/04/1fc2a3fdcd2d2c35783ea678ca8152442907aaea.jpg" alt="图片3">
</div>


<script>
    // 初始化 Viewer
    var gallery = new Viewer(document.getElementById('gallery'));
    // 点击任意图片即可自动弹出预览
</script>

演示地址：https://yanshi.wuhanqq.com/p/viewerjs.html