| document.addEventListener('DOMContentLoaded', function() { | |
| // 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' | |
| }); | |
| }); | |
| }); | |
| // Form submission handling | |
| const contactForm = document.querySelector('form'); | |
| if (contactForm) { | |
| contactForm.addEventListener('submit', function(e) { | |
| e.preventDefault(); | |
| alert('Thank you for your message! BarbieBot will get back to you soon. π'); | |
| this.reset(); | |
| }); | |
| } | |
| // Animate elements when they come into view | |
| const animateOnScroll = () => { | |
| const elements = document.querySelectorAll('.animate-on-scroll'); | |
| elements.forEach(element => { | |
| const elementPosition = element.getBoundingClientRect().top; | |
| const screenPosition = window.innerHeight / 1.2; | |
| if (elementPosition < screenPosition) { | |
| element.classList.add('animate-fadeInUp'); | |
| } | |
| }); | |
| }; | |
| window.addEventListener('scroll', animateOnScroll); | |
| animateOnScroll(); // Run once on load | |
| }); |