Spaces:
Running
Running
| document.addEventListener('DOMContentLoaded', () => { | |
| // Mobile menu toggle functionality | |
| const mobileMenuButton = document.getElementById('mobile-menu-button'); | |
| const mobileMenu = document.getElementById('mobile-menu'); | |
| if (mobileMenuButton && mobileMenu) { | |
| mobileMenuButton.addEventListener('click', () => { | |
| mobileMenu.classList.toggle('hidden'); | |
| }); | |
| } | |
| // Smooth scrolling for anchor links | |
| document.querySelectorAll('a[href^="#"]').forEach(anchor => { | |
| anchor.addEventListener('click', function(e) { | |
| e.preventDefault(); | |
| document.querySelector(this.getAttribute('href')).scrollIntoView({ | |
| behavior: 'smooth' | |
| }); | |
| }); | |
| }); | |
| // Animation on scroll | |
| const animateOnScroll = () => { | |
| const elements = document.querySelectorAll('.animate-on-scroll'); | |
| elements.forEach(element => { | |
| const elementPosition = element.getBoundingClientRect().top; | |
| const screenPosition = window.innerHeight / 1.3; | |
| if (elementPosition < screenPosition) { | |
| element.classList.add('opacity-100', 'translate-y-0'); | |
| element.classList.remove('opacity-0', 'translate-y-10'); | |
| } | |
| }); | |
| }; | |
| window.addEventListener('scroll', animateOnScroll); | |
| animateOnScroll(); // Run once on load | |
| }); |