|
|
| 第1行: |
第1行: |
| /* 这里的任何JavaScript将为所有用户在每次页面加载时加载。 */
| |
| /* ===== 首页轮播图 ===== */
| |
| (function () {
| |
| function initHomeCarousel() {
| |
| var carousel = document.getElementById('home-carousel');
| |
| if (!carousel) return;
| |
|
| |
|
| var items = carousel.querySelectorAll('.home-carousel-item');
| |
| var dotsBox = document.getElementById('home-carousel-dots');
| |
| var prevBtn = document.getElementById('home-carousel-prev');
| |
| var nextBtn = document.getElementById('home-carousel-next');
| |
| if (!items.length || !dotsBox || !prevBtn || !nextBtn) return;
| |
|
| |
| var current = 0;
| |
| var timer = null;
| |
|
| |
| items.forEach(function (_, i) {
| |
| var dot = document.createElement('span');
| |
| dot.className = 'home-carousel-dot' + (i === 0 ? ' active' : '');
| |
| dot.addEventListener('click', function () { goTo(i); });
| |
| dotsBox.appendChild(dot);
| |
| });
| |
| var dots = dotsBox.querySelectorAll('.home-carousel-dot');
| |
|
| |
| function goTo(index) {
| |
| items[current].classList.remove('active');
| |
| dots[current].classList.remove('active');
| |
| current = (index + items.length) % items.length;
| |
| items[current].classList.add('active');
| |
| dots[current].classList.add('active');
| |
| }
| |
|
| |
| function next() { goTo(current + 1); }
| |
| function prev() { goTo(current - 1); }
| |
|
| |
| function startAuto() {
| |
| stopAuto();
| |
| timer = setInterval(next, 5000);
| |
| }
| |
| function stopAuto() {
| |
| if (timer) { clearInterval(timer); timer = null; }
| |
| }
| |
|
| |
| nextBtn.addEventListener('click', function () { next(); startAuto(); });
| |
| prevBtn.addEventListener('click', function () { prev(); startAuto(); });
| |
| carousel.addEventListener('mouseenter', stopAuto);
| |
| carousel.addEventListener('mouseleave', startAuto);
| |
|
| |
| startAuto();
| |
| }
| |
|
| |
| if (document.readyState === 'loading') {
| |
| document.addEventListener('DOMContentLoaded', initHomeCarousel);
| |
| } else {
| |
| initHomeCarousel();
| |
| }
| |
| })();
| |