92 lines
2.7 KiB
JavaScript
92 lines
2.7 KiB
JavaScript
// 导航栏滚动效果
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
const navbar = document.querySelector('.navbar');
|
|
|
|
window.addEventListener('scroll', function() {
|
|
if (window.scrollY > 50) {
|
|
navbar.classList.add('scrolled');
|
|
} else {
|
|
navbar.classList.remove('scrolled');
|
|
}
|
|
});
|
|
|
|
// 平滑滚动
|
|
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
|
|
anchor.addEventListener('click', function(e) {
|
|
e.preventDefault();
|
|
|
|
const targetId = this.getAttribute('href');
|
|
const targetElement = document.querySelector(targetId);
|
|
|
|
if (targetElement) {
|
|
window.scrollTo({
|
|
top: targetElement.offsetTop - 70,
|
|
behavior: 'smooth'
|
|
});
|
|
}
|
|
});
|
|
});
|
|
|
|
// 新闻轮播
|
|
const newsContainer = document.querySelector('#news .row');
|
|
const newsItems = document.querySelectorAll('#news .col-md-4');
|
|
|
|
if (newsItems.length > 0) {
|
|
// 创建轮播指示器
|
|
const indicatorsContainer = document.createElement('div');
|
|
indicatorsContainer.className = 'carousel-indicators d-flex justify-content-center mt-3';
|
|
|
|
// 为每个新闻项创建指示器
|
|
newsItems.forEach((item, index) => {
|
|
const indicator = document.createElement('button');
|
|
indicator.type = 'button';
|
|
indicator.className = index === 0 ? 'active' : '';
|
|
indicator.setAttribute('data-bs-target', '#news');
|
|
indicator.setAttribute('data-bs-slide-to', index.toString());
|
|
|
|
indicator.addEventListener('click', () => {
|
|
showNews(index);
|
|
});
|
|
|
|
indicatorsContainer.appendChild(indicator);
|
|
});
|
|
|
|
// 将指示器添加到新闻区域
|
|
newsContainer.parentNode.insertBefore(indicatorsContainer, newsContainer.nextSibling);
|
|
|
|
let currentIndex = 0;
|
|
|
|
function showNews(index) {
|
|
// 隐藏所有新闻项
|
|
newsItems.forEach(item => {
|
|
item.classList.remove('d-block');
|
|
item.classList.add('d-none');
|
|
});
|
|
|
|
// 显示指定新闻项
|
|
newsItems[index].classList.remove('d-none');
|
|
newsItems[index].classList.add('d-block');
|
|
|
|
// 更新指示器
|
|
const indicators = indicatorsContainer.querySelectorAll('button');
|
|
indicators.forEach((indicator, i) => {
|
|
if (i === index) {
|
|
indicator.classList.add('active');
|
|
} else {
|
|
indicator.classList.remove('active');
|
|
}
|
|
});
|
|
|
|
currentIndex = index;
|
|
}
|
|
|
|
// 初始化第一个新闻项
|
|
showNews(0);
|
|
|
|
// 每5秒自动轮播
|
|
setInterval(() => {
|
|
const nextIndex = (currentIndex + 1) % newsItems.length;
|
|
showNews(nextIndex);
|
|
}, 5000);
|
|
}
|
|
}); |