Spaces:
Running
Running
| document.addEventListener('DOMContentLoaded', function() { | |
| // Mobile menu toggle | |
| const mobileMenuButton = document.querySelector('header button'); | |
| const mobileMenu = document.createElement('div'); | |
| mobileMenu.className = 'mobile-menu hidden bg-white w-full absolute left-0 top-full shadow-lg z-50'; | |
| const navItems = [ | |
| {text: 'Главная', href: '#'}, | |
| {text: 'Услуги', href: '#'}, | |
| {text: 'Специалисты', href: '#'}, | |
| {text: 'Цены', href: '#'}, | |
| {text: 'О нас', href: '#'}, | |
| {text: 'Контакты', href: '#'}, | |
| {text: 'Блог', href: '#'} | |
| ]; | |
| const navList = document.createElement('ul'); | |
| navList.className = 'py-4'; | |
| navItems.forEach(item => { | |
| const li = document.createElement('li'); | |
| const a = document.createElement('a'); | |
| a.href = item.href; | |
| a.className = 'block px-6 py-2 hover:bg-gray-100 font-medium'; | |
| a.textContent = item.text; | |
| li.appendChild(a); | |
| navList.appendChild(li); | |
| }); | |
| mobileMenu.appendChild(navList); | |
| document.querySelector('header').appendChild(mobileMenu); | |
| mobileMenuButton.addEventListener('click', function() { | |
| mobileMenu.classList.toggle('hidden'); | |
| feather.replace(); | |
| }); | |
| // Smooth scrolling for anchor links | |
| 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' | |
| }); | |
| } | |
| }); | |
| }); | |
| // Form submission | |
| const appointmentForm = document.querySelector('form'); | |
| if (appointmentForm) { | |
| appointmentForm.addEventListener('submit', function(e) { | |
| e.preventDefault(); | |
| // Here you would normally send the form data to the server | |
| // For demo purposes, we'll just show an alert | |
| alert('Спасибо! Ваша заявка отправлена. Мы свяжемся с вами в ближайшее время.'); | |
| this.reset(); | |
| }); | |
| } | |
| // Add hover effects to elements | |
| document.querySelectorAll('.btn-hover').forEach(btn => { | |
| btn.addEventListener('mouseenter', function() { | |
| this.classList.add('transform', '-translate-y-1', 'shadow-md'); | |
| }); | |
| btn.addEventListener('mouseleave', function() { | |
| this.classList.remove('transform', '-translate-y-1', 'shadow-md'); | |
| }); | |
| }); | |
| // Initialize Feather Icons | |
| feather.replace(); | |
| }); |