Widget:GF立绘切换：修订间差异

←上一编辑下一编辑→

可视化wikitext

@@ 第1行： / 第1行： @@
 <includeonly><script>
 (function() {
-    // 等待DOM和图片加载完成
      function initSwitcher() {
          document.querySelectorAll('.gf-infobox-new').forEach(function(box) {
-             if (box.dataset.initialized) return;
+             if (box.dataset.switcherReady) return;
-             box.dataset.initialized = 'true';
+             box.dataset.switcherReady = 'true';
              var container = box.querySelector('.gf-image-container');
-             var thumbs = box.querySelectorAll('.gf-thumb-item');
+             var thumbItems = box.querySelectorAll('.gf-thumb-item');
-             if (!container || thumbs.length < 2) return;
+             if (!container || thumbItems.length < 2) return;
-             thumbs.forEach(function(thumb) {
+             thumbItems.forEach(function(item) {
-                 thumb.addEventListener('click', function(e) {
+                 item.addEventListener('click', function(e) {
                      e.preventDefault();
                      // 更新激活状态
-                     thumbs.forEach(function(t) { t.classList.remove('active'); });
+                     thumbItems.forEach(function(t) { t.classList.remove('active'); });
                      this.classList.add('active');
-                     // 获取新图片的文件名
+                     // 获取新图片文件名
                      var newFile = this.dataset.img;
                      if (!newFile) return;
-                     // 淡出旧图片
+                     // 获取旧图片
                      var oldImg = container.querySelector('img');
-                    if (oldImg) {
-                        oldImg.style.opacity = '0';
-                        oldImg.style.transition = 'opacity 0.2s ease';
-                    }
-                     // 创建并加载新图片
+                     // 创建新图片
-                     var newImg = document.createElement('img');
+                     var newImg = new Image();
-                    newImg.src = newFile; // MediaWiki会自动处理文件路径
                      newImg.style.maxWidth = '100%';
-                     newImg.style.maxHeight = '400px';
+                     newImg.style.maxHeight = '420px';
                      newImg.style.objectFit = 'contain';
                      newImg.style.opacity = '0';
-                     newImg.style.transition = 'opacity 0.3s ease';
+                     newImg.style.transition = 'opacity 0.35s ease';
                      newImg.onload = function() {
-                         // 替换内容
+                         // 淡出旧图
-                         container.innerHTML = '';
+                        if (oldImg) {
-                        container.appendChild(newImg);
+                            oldImg.style.opacity = '0';
-                        // 触发淡入
+                            oldImg.style.transition = 'opacity 0.2s ease';
-                        requestAnimationFrame(function() {
+                        }
-                            newImg.style.opacity = '1';
-                         });
+                        // 延迟替换
+                         setTimeout(function() {
+                            container.innerHTML = '';
+                            container.appendChild(newImg);
+                            requestAnimationFrame(function() {
+                                newImg.style.opacity = '1';
+                            });
+                         }, 200);
                      };
                      newImg.onerror = function() {
-                         // 如果加载失败，恢复原状
+                        console.warn('Failed to load image: ' + newFile);
+                         // 恢复旧图
                          if (oldImg) {
                              oldImg.style.opacity = '1';
                          }
                      };
+                    // 使用 MediaWiki 文件路径
+                    // 如果文件名不含 File: 前缀，尝试构建路径
+                    if (newFile.startsWith('File:') || newFile.startsWith('文件:')) {
+                        newImg.src = newFile;
+                    } else {
+                        // 假设是 wiki 上的文件名
+                        newImg.src = '/images/' + newFile;
+                        // 备用：直接当作完整URL
+                        newImg.onerror = function() {
+                            newImg.src = newFile;
+                        };
+                    }
                  });
              });
@@ 第67行： / 第82行： @@
      }
-     // 针对动态加载的内容再次尝试
+     // 兼容 MediaWiki 动态加载
      if (window.mw && mw.hook) {
          mw.hook('wikipage.content').add(initSwitcher);

2026年5月15日 (五) 13:46的版本