98 lines
2.5 KiB
JavaScript
98 lines
2.5 KiB
JavaScript
/* ============================================
|
|
UMass Amherst - Main JavaScript
|
|
============================================ */
|
|
|
|
document.addEventListener('DOMContentLoaded', () => {
|
|
|
|
// ---- Mobile Menu ----
|
|
const menuToggle = document.getElementById('menu-toggle');
|
|
const menuClose = document.getElementById('menu-close');
|
|
const mobileMenu = document.getElementById('mobile-menu');
|
|
|
|
if (menuToggle) {
|
|
menuToggle.addEventListener('click', () => {
|
|
mobileMenu.classList.add('active');
|
|
document.body.style.overflow = 'hidden';
|
|
});
|
|
}
|
|
|
|
if (menuClose) {
|
|
menuClose.addEventListener('click', () => {
|
|
mobileMenu.classList.remove('active');
|
|
document.body.style.overflow = '';
|
|
});
|
|
}
|
|
|
|
document.querySelectorAll('.mobile-menu__link').forEach(link => {
|
|
link.addEventListener('click', () => {
|
|
mobileMenu.classList.remove('active');
|
|
document.body.style.overflow = '';
|
|
});
|
|
});
|
|
|
|
document.addEventListener('keydown', (e) => {
|
|
if (e.key === 'Escape' && mobileMenu.classList.contains('active')) {
|
|
mobileMenu.classList.remove('active');
|
|
document.body.style.overflow = '';
|
|
}
|
|
});
|
|
|
|
// ---- Hero Slider ----
|
|
const slides = document.querySelectorAll('.hero__slide');
|
|
const dots = document.querySelectorAll('.hero__dot');
|
|
let currentSlide = 0;
|
|
let slideInterval;
|
|
|
|
function goToSlide(index) {
|
|
slides.forEach(s => s.classList.remove('active'));
|
|
dots.forEach(d => d.classList.remove('active'));
|
|
slides[index].classList.add('active');
|
|
dots[index].classList.add('active');
|
|
currentSlide = index;
|
|
}
|
|
|
|
function nextSlide() {
|
|
const next = (currentSlide + 1) % slides.length;
|
|
goToSlide(next);
|
|
}
|
|
|
|
function startAutoSlide() {
|
|
slideInterval = setInterval(nextSlide, 5000);
|
|
}
|
|
|
|
function resetAutoSlide() {
|
|
clearInterval(slideInterval);
|
|
startAutoSlide();
|
|
}
|
|
|
|
dots.forEach(dot => {
|
|
dot.addEventListener('click', () => {
|
|
const index = parseInt(dot.dataset.slide, 10);
|
|
goToSlide(index);
|
|
resetAutoSlide();
|
|
});
|
|
});
|
|
|
|
if (slides.length > 1) {
|
|
startAutoSlide();
|
|
}
|
|
|
|
// ---- Scroll Animations ----
|
|
const fadeElements = document.querySelectorAll('.fade-up');
|
|
|
|
const observer = new IntersectionObserver((entries) => {
|
|
entries.forEach(entry => {
|
|
if (entry.isIntersecting) {
|
|
entry.target.classList.add('visible');
|
|
observer.unobserve(entry.target);
|
|
}
|
|
});
|
|
}, {
|
|
threshold: 0.1,
|
|
rootMargin: '0px 0px -60px 0px'
|
|
});
|
|
|
|
fadeElements.forEach(el => observer.observe(el));
|
|
|
|
});
|