Spaces:
Running
Running
File size: 2,872 Bytes
ff31ddc 110e71c ff31ddc | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 |
// Smooth scrolling for anchor links
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
anchor.addEventListener('click', function (e) {
e.preventDefault();
const targetId = this.getAttribute('href');
const targetElement = document.querySelector(targetId);
if (targetElement) {
window.scrollTo({
top: targetElement.offsetTop - 80,
behavior: 'smooth'
});
}
});
});
// Animation on scroll
const animateOnScroll = () => {
const elements = document.querySelectorAll('.feature-card, .step-card, .testimonial-card');
elements.forEach(element => {
const elementPosition = element.getBoundingClientRect().top;
const screenPosition = window.innerHeight / 1.3;
if (elementPosition < screenPosition) {
element.style.opacity = 1;
element.style.transform = 'translateY(0)';
}
});
};
// Set initial state for animated elements
document.addEventListener('DOMContentLoaded', () => {
const animatedElements = document.querySelectorAll('.feature-card, .step-card, .testimonial-card');
animatedElements.forEach(element => {
element.style.opacity = 0;
element.style.transform = 'translateY(20px)';
element.style.transition = 'opacity 0.5s ease, transform 0.5s ease';
});
// Trigger animation on scroll
window.addEventListener('scroll', animateOnScroll);
// Initial check in case elements are already in view
animateOnScroll();
});
// Form validation example
const validateForm = (formId) => {
const form = document.getElementById(formId);
if (!form) return;
form.addEventListener('submit', (e) => {
e.preventDefault();
// Example validation
const email = form.querySelector('input[type="email"]');
const message = form.querySelector('textarea');
if (email && !email.value.includes('@')) {
alert('Please enter a valid email address');
return;
}
if (message && message.value.trim() === '') {
alert('Please enter your message');
return;
}
// In a real app, you would submit the form here
alert('Thank you for your message! We will get back to you soon.');
form.reset();
});
};
// Initialize form validation
document.addEventListener('DOMContentLoaded', () => {
validateForm('contact-form');
});
// Mobile menu functionality
document.addEventListener('DOMContentLoaded', () => {
// Handle sidebar open event
document.addEventListener('open-sidebar', () => {
const sidebar = document.querySelector('custom-sidebar');
if (sidebar) {
sidebar.openSidebar();
}
});
});
|