Widget:ScrollSection

<script> (function() {

   function initScrollSections(containerSelector = '.scroll-container') {
       const container = document.querySelector(containerSelector);
       if (!container) return;
       
       const sections = container.querySelectorAll('.scroll-section');
       if (!sections.length) return;

       let currentSection = 0;
       let isScrolling = false;

       // 防抖函数
       function debounce(func, wait) {
           let timeout;
           return function(event) {
               event.preventDefault();
               event.stopPropagation();
               clearTimeout(timeout);
               timeout = setTimeout(() => {
                   func.apply(this, arguments);
               }, wait);
           };
       }

       // 切换部分
       function switchSection(direction) {
           if (isScrolling || sections.length <= 1) return;
           
           isScrolling = true;
           const currentSec = sections[currentSection];
           
           // 计算下一个section
           if (direction > 0) {
               currentSection = (currentSection + 1) % sections.length;
           } else {
               currentSection = (currentSection - 1 + sections.length) % sections.length;
           }
           
           const nextSec = sections[currentSection];
           
           // 设置新section的初始状态
           nextSec.style.display = 'block';
           nextSec.style.transition = 'transform 0.6s ease-out';
           
           if (direction > 0) {
               // 向下滚动：新section从当前位置稍微往下的位置开始
               nextSec.style.transform = 'translateY(8vh)';
           } else {
               // 向上滚动：新section从当前位置稍微往上的位置开始
               nextSec.style.transform = 'translateY(-8vh)';
           }
           
           // 立即隐藏当前section
           currentSec.style.display = 'none';
           
           // 在下一帧将新section移动到目标位置
           requestAnimationFrame(() => {
               nextSec.style.transform = 'translateY(0)';
           });
           
           // 动画结束后清理
           setTimeout(() => {
               nextSec.style.transition = ;
               isScrolling = false;
           }, 600);
       }

       // 处理滚轮事件
       const handleWheel = debounce((event) => {
           const direction = event.deltaY > 0 ? 1 : -1;
           switchSection(direction);
       }, 50);

       // 将事件监听器绑定到 window 对象上
       window.addEventListener('wheel', handleWheel, { passive: false });

       // 初始化第一个section
       sections[0].style.display = 'block';
   }

   // 暴露初始化函数到全局
   window.initScrollSections = initScrollSections;

})();

 document.addEventListener('DOMContentLoaded', function() {
           initScrollSections('.scroll-container');

});

</script>