Nos dernières parutions
Les lycéens de Louise-Michel exposent à l’antenne du conseil départemental à Narbonne
Le travail sur le grand âge de 350 lycéens, réalisé avec le photographe Didier Carluccio, est exposé en ce moment dans le hall d’accueil de l’antenne du conseil départemental…
Grâce à la photo, les résidents de l’Ehpad ont retrouvé de l’énergie
Une exposition de photographies peu ordinaire est à découvrir dans les couloirs de l’Ehpad de Mont-Saint-Vincent, puisqu’elle met en scène les résidents. Des portraits pris en février lors de séances qui ont fait beaucoup de bien au moral des résidents…
Vieillesse en détresse dans les Ehpad
Familles et professionnels estiment que le plan sur le vieillissement et la dépendance préparé par le gouvernement n’est pas à la hauteur de l’évolution démographique de la France…
Enquête Loin des vieux, loin du cœur : le grand âge effacé et oublié
Phénomène récent dans ces proportions, la grande vieillesse n’est pas forcément un naufrage : seule une personne de plus de 85 ans sur cinq est dépendante. Pourtant, la société française ignore cette tranche d’âge, dont elle a une perception biaisée, et souvent négative…
Didier Carluccio met en lumière les aînés
Depuis une vingtaine d’années, Didier Carluccio pose un regard engagé et bienveillant sur la vieillesse…
document.addEventListener("DOMContentLoaded", () => {
gsap.registerPlugin(ScrollTrigger);
// -----------
// GSAP Gallery
// Vérifier si la largeur d'écran est supérieure ou égale à 768px
const mediaQuery = window.matchMedia("(min-width: 768px)");
// Fonction pour exécuter les animations GSAP
function setupAnimations() {
if (mediaQuery.matches) {
const galleryColumnLeftItems = gsap.utils.toArray(".gallery__column--left-item");
const galleryColumnRightItems = gsap.utils.toArray(".gallery__column--right-item");
const galleryColumnLeft = document.querySelector(".gallery__column--left");
const galleryColumnRight = document.querySelector(".gallery__column--right");
const galleryColumnLeftHeight = galleryColumnLeft.getBoundingClientRect().height;
const galleryColumnRightHeight = galleryColumnRight.getBoundingClientRect().height;
gsap.to(galleryColumnLeftItems, {
yPercent: 100 * (galleryColumnLeftItems.length - 1) + 2,
ease: "none",
scrollTrigger: {
trigger: ".gallery__column--left",
start: "top top",
end: `+=${galleryColumnLeftHeight}`,
scrub: 0.2,
pin: true,
}
});
gsap.to(galleryColumnRightItems, {
yPercent: -100 * (galleryColumnRightItems.length - 1),
ease: "none",
scrollTrigger: {
trigger: ".gallery__column--right",
start: "top top",
end: `+=${galleryColumnRightHeight}`,
scrub: 0.2,
pin: true,
}
});
}
}
// Exécuter les animations au chargement initial
setupAnimations();
// Rafraîchir ScrollTrigger et réexécuter les animations lors du redimensionnement
window.addEventListener("resize", () => {
ScrollTrigger.refresh();
setupAnimations();
});
// Écouter les changements de la media query
mediaQuery.addEventListener("change", () => {
ScrollTrigger.refresh();
setupAnimations();
});
// ---------
// GSAP Titre
let fontSize = window.getComputedStyle(document.body).getPropertyValue('--font-size-xl');
gsap.set('.home__content', { backgroundColor: "#000" });
gsap.to('.home__content', {
backgroundColor: "#FFF",
scrollTrigger: {
start: '40% 40%',
end: '60%',
toggleActions: 'play none none reverse',
scrub: true,
}
});
// Animation du h1 seulement au-dessus de 768px
ScrollTrigger.matchMedia({
"(min-width: 768px)": function() {
gsap.to('h1', {
fontSize: fontSize,
scrollTrigger: {
trigger: 'h1',
start: 'top 80%',
end: 'bottom 10%',
scrub: true,
}
});
}
});
});