| | document.addEventListener('DOMContentLoaded', function() { |
| | |
| | document.querySelectorAll('a[href^="#"]').forEach(anchor => { |
| | anchor.addEventListener('click', function(e) { |
| | e.preventDefault(); |
| | |
| | const targetId = this.getAttribute('href'); |
| | if (targetId === '#') return; |
| | |
| | const targetElement = document.querySelector(targetId); |
| | if (targetElement) { |
| | targetElement.scrollIntoView({ |
| | behavior: 'smooth' |
| | }); |
| | } |
| | }); |
| | }); |
| |
|
| | |
| | const animateOnScroll = function() { |
| | const elements = document.querySelectorAll('.animate-on-scroll'); |
| | |
| | elements.forEach(element => { |
| | const elementPosition = element.getBoundingClientRect().top; |
| | const windowHeight = window.innerHeight; |
| | |
| | if (elementPosition < windowHeight - 100) { |
| | element.classList.add('animate-fade-in'); |
| | } |
| | }); |
| | }; |
| |
|
| | |
| | window.addEventListener('scroll', animateOnScroll); |
| | animateOnScroll(); |
| |
|
| | |
| | const contactForm = document.querySelector('#contact form'); |
| | if (contactForm) { |
| | contactForm.addEventListener('submit', function(e) { |
| | e.preventDefault(); |
| | |
| | |
| | const name = this.querySelector('#name').value.trim(); |
| | const email = this.querySelector('#email').value.trim(); |
| | const message = this.querySelector('#message').value.trim(); |
| | |
| | if (!name || !email || !message) { |
| | alert('Please fill in all required fields.'); |
| | return; |
| | } |
| | |
| | |
| | console.log('Form submitted:', { name, email, message }); |
| | |
| | |
| | alert('Thank you for your message! I will get back to you soon.'); |
| | this.reset(); |
| | }); |
| | } |
| | }); |