fix: Mermaid 放大改用事件委托方案

docs/js/mermaid-zoom.js

@@ -1,33 +1,14 @@
-document.addEventListener('DOMContentLoaded', function () {
+// Mermaid 图表点击放大 — 事件委托方案
-  // 等待 Mermaid 渲染完成（Mermaid 在 DOMContentLoaded 之后异步渲染）
+;(function () {
-  const observer = new MutationObserver(function () {
+  // 创建 overlay
-    const svgs = document.querySelectorAll('.mermaid svg');
+  function openZoom(mermaidEl) {
-    if (svgs.length > 0) {
+    var svg = mermaidEl.querySelector('svg');
-      observer.disconnect();
-      initMermaidZoom();
-    }
-  });
-
-  observer.observe(document.body, { childList: true, subtree: true });
-
-  // 也尝试立即初始化（以防 Mermaid 已经渲染完）
-  setTimeout(initMermaidZoom, 1000);
-});
-
-function initMermaidZoom() {
-  // 避免重复绑定
-  if (document.querySelector('.mermaid-zoom-overlay')) return;
-
-  document.querySelectorAll('.mermaid').forEach(function (el) {
-    if (el.dataset.zoomBound) return;
-    el.dataset.zoomBound = 'true';
-
-    el.addEventListener('click', function () {
-      const svg = el.querySelector('svg');
     if (!svg) return;
 
-      const clone = svg.cloneNode(true);
+    // 防止重复打开
-      // 让克隆的 SVG 自适应放大
+    if (document.querySelector('.mermaid-zoom-overlay')) return;
+
+    var clone = svg.cloneNode(true);
     clone.removeAttribute('width');
     clone.removeAttribute('height');
     clone.style.width = 'auto';
@@ -35,33 +16,41 @@ function initMermaidZoom() {
     clone.style.maxWidth = '95vw';
     clone.style.maxHeight = '95vh';
 
-      const overlay = document.createElement('div');
+    var overlay = document.createElement('div');
     overlay.className = 'mermaid-zoom-overlay';
     overlay.appendChild(clone);
 
-      // 点击 overlay 关闭
+    overlay.addEventListener('click', function () {
-      overlay.addEventListener('click', function (e) {
-        if (e.target === overlay || e.target.closest('svg')) {
       overlay.classList.remove('active');
       setTimeout(function () { overlay.remove(); }, 200);
-        }
     });
 
-      // ESC 关闭
+    document.addEventListener('keydown', function handler(e) {
-      function onKey(e) {
       if (e.key === 'Escape') {
         overlay.classList.remove('active');
         setTimeout(function () { overlay.remove(); }, 200);
-          document.removeEventListener('keydown', onKey);
+        document.removeEventListener('keydown', handler);
       }
-      }
+    });
-      document.addEventListener('keydown', onKey);
 
     document.body.appendChild(overlay);
-      // 触发动画
     requestAnimationFrame(function () {
       overlay.classList.add('active');
     });
-    });
-  });
   }
+
+  // 事件委托：点击时往上找 .mermaid
+  document.addEventListener('click', function (e) {
+    var target = e.target.closest('.mermaid');
+    if (target) {
+      e.preventDefault();
+      e.stopPropagation();
+      openZoom(target);
+    }
+  });
+
+  // 兼容 MkDocs Material instant navigation：
+  // 页面切换后 Mermaid 可能重新渲染，无需重新绑定（事件委托天然兼容）
+  // 但需要确保 .mermaid 的 cursor 样式对新渲染的图表也生效
+  // （CSS 全局生效，无需额外处理）
+})();