Mode focus — masquer la navigation
Un bouton bascule le masquage de l’en-tête, du panneau et du pied pour se concentrer.
Code à copier
var hidden = false;
var sels = 'header, nav, aside, footer, [role="banner"], [role="navigation"]';
var btn = document.createElement('button');
btn.textContent = 'Focus';
btn.style.cssText = 'position:fixed;bottom:20px;left:20px;z-index:99999;padding:8px 14px;border:none;border-radius:4px;background:#006870;color:#fff;cursor:pointer';
btn.onclick = function () {
hidden = !hidden;
document.querySelectorAll(sels).forEach(function (el) {
el.style.display = hidden ? 'none' : '';
});
btn.textContent = hidden ? 'Show' : 'Focus';
};
document.body.appendChild(btn);Comment utiliser cet exemple
- Copiez le code avec le bouton ci-dessus.
- Installez JustZix (2 minutes) et ouvrez l'extension sur la page cible.
- Ajoutez une nouvelle règle correspondant à cette page.
- Collez le code dans le panneau JavaScript de la règle et enregistrez — il s'exécute à chaque visite de page.
Notez cet exemple
Aucune note — soyez le premier.