44 lines
1.1 KiB
JavaScript
44 lines
1.1 KiB
JavaScript
/******/ (() => { // webpackBootstrap
|
|
/*!*********************!*\
|
|
!*** ./src/view.js ***!
|
|
\*********************/
|
|
const cards = gsap.utils.toArray(".scroll-story-block .narrative-card");
|
|
|
|
// Ajouter des classes alternées pour le styling
|
|
cards.forEach((card, index) => {
|
|
if (index % 2 === 0) {
|
|
card.classList.add("narrative-card--even");
|
|
} else {
|
|
card.classList.add("narrative-card--odd");
|
|
}
|
|
});
|
|
let stickDistance = 0;
|
|
let firstCardST = ScrollTrigger.create({
|
|
trigger: cards[0],
|
|
start: "top 10%"
|
|
});
|
|
let lastCardST = ScrollTrigger.create({
|
|
trigger: cards[cards.length - 1],
|
|
start: "top 10%"
|
|
});
|
|
cards.forEach((card, index) => {
|
|
var scale = 1 - (cards.length - index) * 0.025;
|
|
let scaleDown = gsap.to(card, {
|
|
scale: scale,
|
|
"transform-origin": '"50% ' + (lastCardST.start + stickDistance) + '"'
|
|
});
|
|
ScrollTrigger.create({
|
|
trigger: card,
|
|
start: "top 10%",
|
|
end: () => lastCardST.start + stickDistance,
|
|
pin: true,
|
|
// markers: true,
|
|
pinSpacing: false,
|
|
ease: "none",
|
|
animation: scaleDown,
|
|
toggleActions: "restart none none reverse"
|
|
});
|
|
});
|
|
/******/ })()
|
|
;
|
|
//# sourceMappingURL=view.js.map
|