diff --git a/web/themes/custom/leshed/assets/js/main.js b/web/themes/custom/leshed/assets/js/main.js index e1893fa..9a77c6b 100644 --- a/web/themes/custom/leshed/assets/js/main.js +++ b/web/themes/custom/leshed/assets/js/main.js @@ -154,21 +154,28 @@ gsap.registerPlugin(ScrollTrigger); function initPageFull(){ console.log('initPageFull'); + + const headerScaleTarget = 0.4; + // PAGE TITLE SCALING DOWN - const pageHeader = document.querySelector('article.node-type-projet.view-mode-full .cols>.col.left>header, article.node-type-evenement.view-mode-full>.cols>.col.left>header'); + const pageHeader = document.querySelector('\ + article.node-type-projet.view-mode-full .cols>.col.left>header,\ + article.node-type-evenement.view-mode-full .cols>.col.left>header\ + '); console.log('pageHeader', pageHeader); + const initHeaderH = pageHeader ? pageHeader.offsetHeight : 0; + if (pageHeader) { // needs requestAnimationFrame to get the real titleHeight after splitting + + // console.log(`initHeaderH: ${initHeaderH}`); + const end = initHeaderH - initHeaderH * headerScaleTarget; + // console.log(`end: ${end}`); + requestAnimationFrame(() => { requestAnimationFrame(() => { - const initheaderH = pageHeader.offsetHeight; - // console.log(`initheaderH: ${initheaderH}`); - const headerScaleTarget = 0.4; - const end = initheaderH - initheaderH * headerScaleTarget; - // console.log(`end: ${end}`); - gsap_mm.add('(min-width: 768px)', () => { gsap.to(pageHeader, { scale: headerScaleTarget, @@ -206,7 +213,7 @@ gsap.registerPlugin(ScrollTrigger); const leftFreezeStart = () => { const overflow = leftColumn.offsetHeight - scroller.clientHeight; if (overflow > 0) return overflow; - return initheaderH ? initheaderH.offsetHeight * (1 - titleScaleTarget) : 0; + return pageHeader ? initHeaderH * (1 - headerScaleTarget) : 0; }; gsap_mm.add('(min-width: 768px)', () => {