Accessibility
Remove Focus Border Without Breaking Accessibility
This border can break the design and many times we remove it, but if we remove it in the wrong…
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
});
});