68 lines
2.5 KiB
JavaScript
68 lines
2.5 KiB
JavaScript
// Мобильное меню
|
||
document.addEventListener('DOMContentLoaded', function () {
|
||
const menuToggle = document.querySelector('.menu-toggle');
|
||
const navLinks = document.querySelector('.nav-links');
|
||
|
||
menuToggle.addEventListener('click', function () {
|
||
navLinks.classList.toggle('active');
|
||
});
|
||
|
||
// Закрытие меню при клике на ссылку
|
||
document.querySelectorAll('.nav-links a').forEach(link => {
|
||
link.addEventListener('click', () => {
|
||
navLinks.classList.remove('active');
|
||
});
|
||
});
|
||
|
||
// Плавная прокрутка
|
||
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) {
|
||
window.scrollTo({
|
||
top: targetElement.offsetTop - 80,
|
||
behavior: 'smooth'
|
||
});
|
||
}
|
||
});
|
||
});
|
||
|
||
// Форма обратной связи
|
||
const contactForm = document.querySelector('.contact-form');
|
||
if (contactForm) {
|
||
contactForm.addEventListener('submit', function (e) {
|
||
e.preventDefault();
|
||
|
||
// Здесь можно добавить отправку формы на сервер
|
||
alert('Спасибо за сообщение! Я свяжусь с вами в ближайшее время.');
|
||
this.reset();
|
||
});
|
||
}
|
||
|
||
// Анимация появления элементов при скролле
|
||
const observerOptions = {
|
||
threshold: 0.1,
|
||
rootMargin: '0px 0px -50px 0px'
|
||
};
|
||
|
||
const observer = new IntersectionObserver((entries) => {
|
||
entries.forEach(entry => {
|
||
if (entry.isIntersecting) {
|
||
entry.target.style.opacity = '1';
|
||
entry.target.style.transform = 'translateY(0)';
|
||
}
|
||
});
|
||
}, observerOptions);
|
||
|
||
// Наблюдаем за карточками
|
||
document.querySelectorAll('.fact-card, .interest-card, .project-card, .blog-card').forEach(card => {
|
||
card.style.opacity = '0';
|
||
card.style.transform = 'translateY(20px)';
|
||
card.style.transition = 'opacity 0.6s ease, transform 0.6s ease';
|
||
observer.observe(card);
|
||
});
|
||
}); |