It is important that you watch this video so that you know how to change the pagination depending on the number of slides. Remember that the number of slides in each slider must be the same.
document.addEventListener('DOMContentLoaded', () => {
// Espera a que todo cargue (incluido Bricks)
window.addEventListener('load', () => {
setTimeout(() => {
const headerEl = document.getElementById('brx-header');
const targetEls = Array.from(document.querySelectorAll('.fb-hide-on-scroll'));
if (!headerEl || !targetEls.length) return;
let headerHeight = 0;
let addThreshold = 0;
let removeThreshold = 0;
let hidden = false;
let ticking = false;
function updateHeights() {
headerHeight = headerEl.getBoundingClientRect().height;
addThreshold = Math.ceil(headerHeight) + 1;
removeThreshold = Math.max(0, Math.floor(headerHeight) - 6);
}
function applyHiddenClass(shouldHide) {
targetEls.forEach(el => {
el.classList.toggle('fb-hide', shouldHide);
});
}
function onScrollRaf() {
const scrollY = window.scrollY || window.pageYOffset;
if (!hidden && scrollY > addThreshold) {
hidden = true;
applyHiddenClass(true);
} else if (hidden && scrollY < removeThreshold) {
hidden = false;
applyHiddenClass(false);
}
ticking = false;
}
function onScroll() {
if (!ticking) {
ticking = true;
requestAnimationFrame(onScrollRaf);
}
}
updateHeights();
window.addEventListener('scroll', onScroll, { passive: true });
window.addEventListener('resize', () => {
updateHeights();
onScrollRaf();
});
if (typeof ResizeObserver !== 'undefined') {
const ro = new ResizeObserver(() => {
updateHeights();
onScrollRaf();
});
ro.observe(headerEl);
}
onScrollRaf();
}, 400); // <-- inicia 1 segundo después de la carga completa
});
});