微件:轮换播放

{$images|unescape:'html'}

   <style>
       .mw-carousel-simple {
           position: relative;
           width: 100%;
           overflow: hidden;
           max-width: 900px;
           margin: 0 auto;
       }
       .mw-carousel-container {
           position: relative;
           width: 100%;
           aspect-ratio: 16 / 9;
           min-height: 200px;
           /* 无背景色 */
       }
       .mw-slide {
           position: absolute;
           inset: 0;
           opacity: 0;
           transition: opacity 0.8s ease;
           pointer-events: none;
       }
       .mw-slide.active {
           opacity: 1;
           pointer-events: auto;
           z-index: 2;
       }
       .mw-slide img {
           width: 100%;
           height: 100%;
           object-fit: cover; /* 如需完整显示改为 contain */
       }
   </style>

   <script>
   (function() {
       var el = document.currentScript.closest('.mw-carousel-simple');
       if (!el) return;

       var raw = el.querySelector('.mw-carousel-images-raw');
       var container = el.querySelector('.mw-carousel-container');
       if (!raw || !container) return;

       var items = Array.from(raw.childNodes).filter(n => 
           !(n.nodeType === 3 && n.nodeValue.trim() === )
       );

       if (items.length === 0) return;

       var interval = parseInt(el.dataset.interval, 10) || 3000;
       var slides = [];
       var current = 0;

       items.forEach((item, i) => {
           var slide = document.createElement('div');
           slide.className = 'mw-slide';
           slide.appendChild(item.cloneNode(true));
           if (i === 0) slide.classList.add('active');
           container.appendChild(slide);
           slides.push(slide);
       });

       if (slides.length <= 1) return;

       var timer = setInterval(() => {
           slides[current].classList.remove('active');
           current = (current + 1) % slides.length;
           slides[current].classList.add('active');
       }, interval);

       el.addEventListener('mouseenter', () => clearInterval(timer));
       el.addEventListener('mouseleave', () => {
           timer = setInterval(() => {
               slides[current].classList.remove('active');
               current = (current + 1) % slides.length;
               slides[current].classList.add('active');
           }, interval);
       });
   })();
   </script>