86 lines
2.6 KiB
JavaScript
86 lines
2.6 KiB
JavaScript
// 标签页切换
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
const tabItems = document.querySelectorAll('.tab-item');
|
|
|
|
tabItems.forEach(item => {
|
|
item.addEventListener('click', function() {
|
|
// 移除所有active状态
|
|
tabItems.forEach(tab => tab.classList.remove('active'));
|
|
// 为当前点击项添加active状态
|
|
this.classList.add('active');
|
|
});
|
|
});
|
|
|
|
// 轮播图功能
|
|
const carouselItems = document.querySelectorAll('.carousel-item');
|
|
const carouselIndicators = document.querySelectorAll('.carousel-indicator');
|
|
const prevBtn = document.querySelector('.carousel-control.prev');
|
|
const nextBtn = document.querySelector('.carousel-control.next');
|
|
let currentIndex = 0;
|
|
let interval;
|
|
|
|
// 初始化轮播
|
|
function initCarousel() {
|
|
// 启动自动轮播
|
|
startCarousel();
|
|
|
|
// 绑定控制按钮事件
|
|
if (prevBtn && nextBtn) {
|
|
prevBtn.addEventListener('click', prevSlide);
|
|
nextBtn.addEventListener('click', nextSlide);
|
|
}
|
|
|
|
// 绑定指示点事件
|
|
carouselIndicators.forEach((indicator, index) => {
|
|
indicator.addEventListener('click', () => {
|
|
goToSlide(index);
|
|
});
|
|
});
|
|
|
|
// Lines 39-45
|
|
|
|
// 鼠标悬停时暂停轮播
|
|
const carousel = document.querySelector('.carousel');
|
|
if (carousel) {
|
|
carousel.addEventListener('mouseenter', pauseCarousel);
|
|
carousel.addEventListener('mouseleave', startCarousel);
|
|
}
|
|
}
|
|
|
|
// 显示指定幻灯片
|
|
function goToSlide(index) {
|
|
// 移除当前激活状态
|
|
carouselItems[currentIndex].classList.remove('active');
|
|
carouselIndicators[currentIndex].classList.remove('active');
|
|
|
|
// 更新索引
|
|
currentIndex = (index + carouselItems.length) % carouselItems.length;
|
|
|
|
// 添加新激活状态
|
|
carouselItems[currentIndex].classList.add('active');
|
|
carouselIndicators[currentIndex].classList.add('active');
|
|
}
|
|
|
|
// 下一张幻灯片
|
|
function nextSlide() {
|
|
goToSlide(currentIndex + 1);
|
|
}
|
|
|
|
// 上一张幻灯片
|
|
function prevSlide() {
|
|
goToSlide(currentIndex - 1);
|
|
}
|
|
|
|
// 暂停轮播
|
|
function pauseCarousel() {
|
|
clearInterval(interval);
|
|
}
|
|
|
|
// 开始轮播
|
|
function startCarousel() {
|
|
interval = setInterval(nextSlide, 5000);
|
|
}
|
|
|
|
// 初始化轮播
|
|
initCarousel();
|
|
}); |