更新项目文件结构,统一文档风格
This commit is contained in:
92
website/js/main.js
Normal file
92
website/js/main.js
Normal file
@@ -0,0 +1,92 @@
|
||||
// 导航栏滚动效果
|
||||
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);
|
||||
}
|
||||
});
|
||||
Reference in New Issue
Block a user