fix: scrolling effect error
This commit is contained in:
@@ -729,6 +729,16 @@ input[type="number"]:focus {
|
||||
color: var(--blanc-creme);
|
||||
}
|
||||
|
||||
/* Scroll Animations */
|
||||
.fade-in-element {
|
||||
opacity: 0;
|
||||
transform: translateY(30px);
|
||||
}
|
||||
|
||||
.fade-in-element.animate-in {
|
||||
animation: fadeInUp 0.8s ease forwards;
|
||||
}
|
||||
|
||||
/* Animations */
|
||||
@keyframes fadeInUp {
|
||||
from {
|
||||
|
||||
@@ -57,21 +57,22 @@ document.addEventListener('click', (e) => {
|
||||
|
||||
// Scroll animations
|
||||
const observerOptions = {
|
||||
threshold: 0.1,
|
||||
rootMargin: '0px 0px -100px 0px'
|
||||
threshold: 0.15,
|
||||
rootMargin: '0px 0px -50px 0px'
|
||||
};
|
||||
|
||||
const observer = new IntersectionObserver((entries) => {
|
||||
entries.forEach(entry => {
|
||||
if (entry.isIntersecting) {
|
||||
entry.target.style.animation = 'fadeInUp 0.8s ease both';
|
||||
entry.target.classList.add('animate-in');
|
||||
observer.unobserve(entry.target);
|
||||
}
|
||||
});
|
||||
}, observerOptions);
|
||||
|
||||
// Observe all cards
|
||||
document.querySelectorAll('.service-card, .project-card, .value-card').forEach(el => {
|
||||
document.querySelectorAll('.service-card, .project-card, .value-card, .partner-card').forEach(el => {
|
||||
el.classList.add('fade-in-element');
|
||||
observer.observe(el);
|
||||
});
|
||||
|
||||
|
||||
Reference in New Issue
Block a user