49 lines
1.3 KiB
JavaScript
49 lines
1.3 KiB
JavaScript
//// views\servicePages\serviceMain.js
|
|
|
|
// Navigation highlighting
|
|
document.addEventListener("DOMContentLoaded", function () {
|
|
// 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) {
|
|
window.scrollTo({
|
|
top: targetElement.offsetTop - 100,
|
|
behavior: "smooth",
|
|
});
|
|
}
|
|
});
|
|
});
|
|
|
|
// Animate service cards on scroll
|
|
const serviceCards = document.querySelectorAll(".category-card");
|
|
|
|
function animateOnScroll() {
|
|
serviceCards.forEach((card) => {
|
|
const cardPosition = card.getBoundingClientRect().top;
|
|
const screenPosition = window.innerHeight / 1.3;
|
|
|
|
if (cardPosition < screenPosition) {
|
|
card.style.opacity = "1";
|
|
card.style.transform = "translateY(0)";
|
|
}
|
|
});
|
|
}
|
|
|
|
// Initialize card styles
|
|
serviceCards.forEach((card) => {
|
|
card.style.opacity = "0";
|
|
card.style.transform = "translateY(20px)";
|
|
card.style.transition = "all 0.5s ease";
|
|
});
|
|
|
|
// Check on load and scroll
|
|
window.addEventListener("scroll", animateOnScroll);
|
|
animateOnScroll();
|
|
});
|