50 lines
No EOL
1.7 KiB
JavaScript
50 lines
No EOL
1.7 KiB
JavaScript
let isInitialized = false;
|
|
|
|
export function bannerStickyMobile(responsiveSmall) {
|
|
if (isInitialized) return;
|
|
|
|
let body = document.body;
|
|
if (!body || body.dataset.template !== 'investigation-summary') return;
|
|
|
|
let bannerPage = body.querySelector("#banner--page");
|
|
let sectionDl = document.querySelector("#section__dl");
|
|
let footer = document.querySelector("#site-footer");
|
|
|
|
if (!bannerPage || !sectionDl || !footer) return;
|
|
|
|
function checkScroll() {
|
|
const screenWidth = window.innerWidth;
|
|
|
|
// Vérifier que l'écran est plus petit que responsiveSmall
|
|
if (screenWidth >= responsiveSmall) {
|
|
bannerPage.classList.remove('is-visible');
|
|
bannerPage.style.transform = 'translateY(0)';
|
|
return;
|
|
}
|
|
|
|
const sectionTop = sectionDl.getBoundingClientRect().top;
|
|
const footerTop = footer.getBoundingClientRect().top;
|
|
const windowHeight = window.innerHeight;
|
|
|
|
// Activer le banner quand #section__dl arrive en bas de l'écran
|
|
if (sectionTop <= windowHeight) {
|
|
bannerPage.classList.add('is-visible');
|
|
|
|
// Pousser le banner vers le haut si le footer arrive en bas de l'écran
|
|
if (footerTop < windowHeight) {
|
|
const pushUp = windowHeight - footerTop;
|
|
bannerPage.style.transform = `translateY(-${pushUp}px)`;
|
|
} else {
|
|
bannerPage.style.transform = 'translateY(0)';
|
|
}
|
|
} else {
|
|
bannerPage.classList.remove('is-visible');
|
|
bannerPage.style.transform = 'translateY(0)';
|
|
}
|
|
}
|
|
|
|
window.addEventListener('scroll', checkScroll);
|
|
checkScroll();
|
|
|
|
isInitialized = true;
|
|
} |