Ajout des écoles + changement CSS
This commit is contained in:
@@ -20,5 +20,37 @@
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<!-- Apparition des cartes au défilement (IntersectionObserver) -->
|
||||
<script>
|
||||
(function () {
|
||||
// On respecte la préférence "réduire les animations" du système
|
||||
if (window.matchMedia('(prefers-reduced-motion: reduce)').matches) return;
|
||||
if (!('IntersectionObserver' in window)) return;
|
||||
|
||||
// Éléments qui apparaissent en glissant vers le haut quand ils entrent dans l'écran
|
||||
var cibles = document.querySelectorAll(
|
||||
'.project-card, .quick-link-card, .skill-category, .contact-card, ' +
|
||||
'.login-card, .project-form-card, .cgu-card, ' +
|
||||
'.page-header, .quick-links-header, .skills-header, .projects-title'
|
||||
);
|
||||
|
||||
var observer = new IntersectionObserver(function (entries) {
|
||||
entries.forEach(function (entry) {
|
||||
if (entry.isIntersecting) {
|
||||
entry.target.classList.add('visible');
|
||||
observer.unobserve(entry.target);
|
||||
}
|
||||
});
|
||||
}, { threshold: 0.1, rootMargin: '0px 0px -40px 0px' });
|
||||
|
||||
cibles.forEach(function (el, i) {
|
||||
el.classList.add('reveal');
|
||||
// Petit décalage en cascade pour les éléments d'une même grille
|
||||
el.style.setProperty('--reveal-delay', ((i % 4) * 0.08) + 's');
|
||||
observer.observe(el);
|
||||
});
|
||||
})();
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user