bottomBar responsive
All checks were successful
Deploy / Deploy to Production (push) Successful in 12s
All checks were successful
Deploy / Deploy to Production (push) Successful in 12s
This commit is contained in:
parent
99ccc15ba9
commit
f24b296ff7
15 changed files with 445 additions and 303 deletions
|
|
@ -62,23 +62,12 @@ export function scrollBack(){
|
|||
const bottomBar = document.getElementById('bottom-bar');
|
||||
const navInvestigation = document.getElementById('nav-investigation');
|
||||
const header = document.getElementById('site-header');
|
||||
const footerEl = document.getElementById('support-bar') || document.getElementById('site-footer');
|
||||
|
||||
let lastY = window.scrollY;
|
||||
let peakY = window.scrollY;
|
||||
let visible = false;
|
||||
|
||||
const show = () => {
|
||||
visible = true;
|
||||
if (bottomBar) bottomBar.classList.add('is-visible');
|
||||
if (navInvestigation && header) header.classList.add('has-nav-investigation');
|
||||
};
|
||||
|
||||
const hide = () => {
|
||||
visible = false;
|
||||
if (bottomBar) bottomBar.classList.remove('is-visible');
|
||||
if (navInvestigation && header) header.classList.remove('has-nav-investigation');
|
||||
};
|
||||
|
||||
window.addEventListener('scroll', () => {
|
||||
const currentY = window.scrollY;
|
||||
|
||||
|
|
@ -87,14 +76,23 @@ export function scrollBack(){
|
|||
header.classList.toggle('has-nav-investigation', currentY >= 160);
|
||||
}
|
||||
|
||||
// bottom-bar : show au scroll bas > 280px, hide après 200px de scroll haut
|
||||
if (currentY > lastY) {
|
||||
// zone footer : bottom-bar masquée et verrouillée
|
||||
const inFooterZone = footerEl && (currentY + window.innerHeight >= footerEl.offsetTop);
|
||||
|
||||
if (inFooterZone) {
|
||||
if (visible) {
|
||||
visible = false;
|
||||
if (bottomBar) bottomBar.classList.remove('is-visible');
|
||||
}
|
||||
} else if (currentY > lastY) {
|
||||
// scroll bas
|
||||
peakY = currentY;
|
||||
if (!visible && currentY > 280) {
|
||||
visible = true;
|
||||
if (bottomBar) bottomBar.classList.add('is-visible');
|
||||
}
|
||||
} else {
|
||||
// scroll haut : hide après 200px remontés
|
||||
if (visible && peakY - currentY >= 200) {
|
||||
visible = false;
|
||||
if (bottomBar) bottomBar.classList.remove('is-visible');
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue