Spaces:
Running
Running
| // Mobile menu toggle functionality | |
| document.addEventListener('DOMContentLoaded', function() { | |
| const mobileMenuButton = document.querySelector('#mobile-menu-button'); | |
| const mobileMenu = document.querySelector('#mobile-menu'); | |
| if (mobileMenuButton) { | |
| mobileMenuButton.addEventListener('click', function() { | |
| mobileMenu.classList.toggle('active'); | |
| const icon = this.querySelector('i'); | |
| if (mobileMenu.classList.contains('active')) { | |
| feather.replace(); | |
| icon.setAttribute('data-feather', 'x'); | |
| } else { | |
| feather.replace(); | |
| icon.setAttribute('data-feather', 'menu'); | |
| } | |
| feather.replace(); | |
| }); | |
| } | |
| // 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' | |
| }); | |
| }); | |
| }); | |
| // Add animation to hero buttons on page load | |
| const heroButtons = document.querySelectorAll('.hero-button'); | |
| heroButtons.forEach((button, index) => { | |
| setTimeout(() => { | |
| button.classList.add('animate-fadeInUp'); | |
| }, index * 100); | |
| }); | |
| }); | |
| // Intersection Observer for scroll animations | |
| const observerOptions = { | |
| threshold: 0.1, | |
| rootMargin: '0px 0px -50px 0px' | |
| }; | |
| const observer = new IntersectionObserver((entries) => { | |
| entries.forEach(entry => { | |
| if (entry.isIntersecting) { | |
| entry.target.classList.add('animate-fadeIn'); | |
| observer.unobserve(entry.target); | |
| } | |
| }); | |
| }, observerOptions); | |
| document.querySelectorAll('.animate-on-scroll').forEach(element => { | |
| observer.observe(element); | |
| }); |