新增丰潇网站

fengxiao/js/header.js

@@ -0,0 +1,57 @@
+document.addEventListener('DOMContentLoaded', function () {
+    /** 主营业务下拉菜单与遮罩层交互 */
+    const dropdown = document.querySelector('.nav-dropdown');
+    const mask = document.querySelector('.dropdown-mask');
+    const navLink = dropdown?.querySelector('.nav-link');
+
+    if (dropdown || mask || navLink) {
+        const handleToggleDropdown = (e) => {
+            e.preventDefault();
+            const isOpen = dropdown.classList.contains('open');
+            if (isOpen) {
+                dropdown.classList.remove('open');
+                dropdown.setAttribute('aria-expanded', 'false');
+                mask.classList.remove('active');
+            } else {
+                dropdown.classList.add('open');
+                dropdown.setAttribute('aria-expanded', 'true');
+                mask.classList.add('active');
+            }
+        };
+
+        const handleCloseDropdown = () => {
+            dropdown.classList.remove('open');
+            dropdown.setAttribute('aria-expanded', 'false');
+            mask.classList.remove('active');
+        };
+
+        // 点击"主营业务"切换下拉
+        navLink.addEventListener('click', handleToggleDropdown);
+
+        // 遮罩层点击关闭
+        mask.addEventListener('click', handleCloseDropdown);
+
+        // 键盘无障碍支持（Enter/Space）
+        dropdown.addEventListener('keydown', (e) => {
+            if (e.key === 'Enter' || e.key === ' ') {
+                e.preventDefault();
+                handleToggleDropdown(e);
+            }
+            if (e.key === 'Escape') {
+                handleCloseDropdown();
+            }
+        });
+    }
+
+});
+
+
+window.addEventListener('scroll', () => {
+    const header = document.querySelector('.header');
+    if (!header) return;
+    if (window.scrollY > 10) {
+      header.classList.add('scrolled');
+    } else {
+      header.classList.remove('scrolled');
+    }
+  });

fengxiao/js/index.js

@@ -0,0 +1,39 @@
+document.addEventListener('DOMContentLoaded', function () {
+    /** business图片滚动动画 */
+    const galleryList = document.querySelector('.gallery-list');
+    const galleryImgs = galleryList ? galleryList.querySelectorAll('img') : [];
+    if (galleryList && galleryImgs.length > 0) {
+        let currentIndex = 0;
+        const imgCount = galleryImgs.length;
+        const imgHeight = galleryImgs[0].offsetHeight + parseInt(getComputedStyle(galleryImgs[0]).marginBottom);
+        let isAnimating = false;
+
+        // 克隆首图到末尾实现无缝滚动
+        const clone = galleryImgs[0].cloneNode(true);
+        galleryList.appendChild(clone);
+
+        function scrollNext() {
+            if (isAnimating) return;
+            isAnimating = true;
+            currentIndex++;
+            galleryList.style.transition = 'transform 0.8s cubic-bezier(.4,0,.2,1)';
+            galleryList.style.transform = `translateY(-${imgHeight * currentIndex}px)`;
+            // 滚动到克隆图后，瞬间回到首图
+            if (currentIndex === imgCount) {
+                setTimeout(() => {
+                    galleryList.style.transition = 'none';
+                    galleryList.style.transform = 'translateY(0)';
+                    currentIndex = 0;
+                    // 强制reflow
+                    void galleryList.offsetWidth;
+                    isAnimating = false;
+                }, 820);
+            } else {
+                setTimeout(() => {
+                    isAnimating = false;
+                }, 820);
+            }
+        }
+        setInterval(scrollNext, 2500);
+    }
+});