| // Shared JavaScript functionality | |
| console.log('Trae.AI Background Replica loaded'); | |
| // Smooth scroll to section | |
| function scrollToSection(sectionId) { | |
| const element = document.getElementById(sectionId); | |
| if (element) { | |
| element.scrollIntoView({ behavior: 'smooth' }); | |
| } | |
| } | |
| // Add intersection observer for animations | |
| document.addEventListener('DOMContentLoaded', function() { | |
| 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-fade-in'); | |
| } | |
| }); | |
| }, observerOptions); | |
| // Observe all elements with the 'observe' class | |
| document.querySelectorAll('.observe').forEach(el => { | |
| observer.observe(el); | |
| }); | |
| }); | |
| // Handle responsive menu | |
| function toggleMobileMenu() { | |
| const mobileMenu = document.getElementById('mobile-menu'); | |
| if (mobileMenu) { | |
| mobileMenu.classList.toggle('hidden'); | |
| } | |
| } | |
| // Add fade-in animation class | |
| const style = document.createElement('style'); | |
| style.textContent = ` | |
| .animate-fade-in { | |
| animation: fadeInUp 0.8s ease-out forwards; | |
| } | |
| @keyframes fadeInUp { | |
| from { | |
| opacity: 0; | |
| transform: translateY(30px); | |
| } | |
| to { | |
| opacity: 1; | |
| transform: translateY(0); | |
| } | |
| } | |
| `; | |
| document.head.appendChild(style); |