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