修改方法
打开 assets/js/main.js，找到图片点击绑定函数（通常在文件末尾的 bindImageClick 函数），修改选择器为同时匹配文章图片和相册图片。
原代码：
function bindImageClick() { document.querySelectorAll('.article-content img').forEach(img => { // ... }); }
修改为：
function bindImageClick() { // 同时绑定文章图片和相册轮播图片 document.querySelectorAll('.article-content img, .swiper-slide img').forEach(img => { if (img.hasAttribute('data-zoom-bound')) return; img.style.cursor = 'pointer'; img.addEventListener('click', (e) => { e.stopPropagation(); openModal(img.src); }); img.setAttribute('data-zoom-bound', 'true'); }); }
完整替换示例
如果使用的是之前提供的完整模态框代码，只需将上述 bindImageClick 函数替换原函数即可。其他部分（openModal、closeModal、滚轮缩放等）保持不变。
注意事项
确保
main.js中已包含完整的模态框实现（您已经提供）。如果相册图片在动态加载（如 Swiper 初始化后），
MutationObserver会监听.gallery-container或父容器。但当前观察的是.article-content，不会自动观察相册图片。为了确保相册图片也能被绑定，可以扩大观察范围，或者直接在bindImageClick中执行（因为页面加载后 Swiper 已经渲染完毕）。简单起见，也可以直接使用上述修改，无需额外监听，因为
DOMContentLoaded时 Swiper 已经初始化，图片存在。
测试
保存修改后的
main.js。清除浏览器缓存，进入相册详情页。
点击轮播中的任意图片，应弹出模态框，支持缩放、拖拽、关闭。
现在相册图片和文章图片的点击放大体验就统一了
发表评论 (0)
留下你的足迹