Masquer les en-têtes de pages web qui restent "coincés" en haut lors du défilement

Les en-têtes fixes (qui ne défilent pas) sont de moins en moins populaires depuis janvier 2016, mais si quelqu'un souhaitait encore manipuler les éléments fixes de manière programmatique, il est facile de les récupérer en JavaScript :

// get Array of all body elements that contain css rule position: fixed
var fixed_elements = Array.prototype.filter.call(
  document.querySelectorAll('body *'),
  function (e) {
    return window.getComputedStyle(e).getPropertyValue('position') === 'fixed'
  }
)

Par exemple, j'ai publié mon Défilement UserScript sur GitHub qui change le style en position:absolute (les éléments restent visibles mais défilent avec le reste de la page) :

• si vous avez déjà GreaseMonkey pour Firefox ou TaperMonkey pour Chrome, vous pouvez utiliser l'option lien brut github pour l'installer
  _{P.S. : n'oubliez pas de modifier les pages incluses / exclues si nécessaire...}

Vous pouvez utiliser un plugin comme Greasemonkey . Il suffit ensuite d'ajouter un peu de javascript personnalisé pour modifier le code CSS de cet élément sur ce site. Il devrait réapparaître la prochaine fois que vous visiterez le site.

La manière la plus simple de supprimer ces ennuyeux en-têtes et pieds de page fixes est d'utiliser un bookmarklet (voir wikipedia si vous ne les connaissez pas).

Créez un signet normal (par exemple en faisant glisser l'icône à gauche de l'URL dans la barre d'outils des signets), puis modifiez-le pour ajouter le code suivant à l'URL du signet :

javascript:(function(){var elems=document.body.getElementsByTagName("*");var len=elems.length;for(var i=0;i<len;i++){var pos=window.getComputedStyle(elems[i],null).getPropertyValue('position');if(pos=='fixed'||pos=='sticky'){var el=elems[i];el.parentNode.removeChild(el);}}})()

En cliquant sur ce signet spécial, vous supprimez tous les éléments d'une page qui ne défilent pas. Sur le bureau de Chrome, vous pouvez afficher/masquer la barre d'outils des signets à l'aide de la touche Ctr + Shift + b (Linux/Windows) ou Command + Shift + b (Mac).

L'avantage des bookmarklets est qu'il n'est pas nécessaire d'installer des plugins ou des extensions supplémentaires.

De plus, les bookmarklets fonctionnent également dans la plupart des navigateurs mobiles, ce qui signifie que vous pouvez les utiliser pour augmenter la zone de lecture sur votre mobile/tablette. Sur IOS, les bookmarklets fonctionnent dans Safari et Chrome (Firefox sur IOS ne permet pas actuellement de modifier les bookmarks).

Sur Android, les bookmarklets sont pris en charge par Chrome, Firefox, Opera et la plupart des navigateurs modernes. Le moyen le plus rapide de lancer un signet est de taper son nom dans la barre d'adresse, puis d'appuyer sur (dans la barre d'adresse). killFixed dans la capture d'écran) lorsqu'il apparaît dans le menu déroulant des suggestions. Apparemment, c'est la seule façon de lancer un bookmarklet dans Firefox et Chrome pour Android. Pour Safari sur iOS, vous devez appuyer sur l'icône des signets, puis, lorsque la liste des signets s'affiche dans une fenêtre contextuelle, appuyer sur votre bookmarklet.

Notez que vous devrez parfois cliquer plusieurs fois sur le bookmarklet pour que tous les éléments soient supprimés.

Il s'agit d'une version améliorée du code de ccpizza. Elle corrige un bogue qui faisait qu'un seul élément de niveau supérieur était supprimé au lieu de tous.

javascript:(function(){var%20found=true;while(found){var%20elems=document.body.getElementsByTagName("*");var%20len=elems.length;for(var%20i=0;i<len;i++){found=false;if(window.getComputedStyle(elems[i],null).getPropertyValue('position')=='fixed'){var%20el=elems[i];el.parentNode.removeChild(el);found=true;break;}}}})()

J'utilise Element Hiding Helper pour Adblock Plus pour me débarrasser du type d'éléments que vous décrivez (qui, je crois, sont appelés éléments "style : fixed"). Plus précisément, lorsque je veux me débarrasser d'un élément, je clique sur l'icône d'Adblock Plus dans ma barre d'outils, je sélectionne "Cacher un élément" (ou quelque chose comme ça - pas de Firefox sur cette machine pour le moment), puis je dois utiliser la combinaison de la souris et de certaines touches (par exemple, "w" pour "élargir la sélection", "n" pour "réduire la sélection", "s" pour "oui, c'est l'élément dont je veux me débarrasser") pour sélectionner un élément, puis j'interagis avec une boîte de dialogue. Mais une fois que j'ai fait cela, l'élément est absent chaque fois que j'utilise Firefox pour visiter ce site web particulier. J'ai fait cela pour des dizaines de sites, et il cache de manière fiable les éléments que je lui ai demandé de cacher.

https://addons.mozilla.org/en-US/firefox/addon/elemhidehelper/

(Je préférerais un module complémentaire qui masque les tous "Il me donne la possibilité d'indiquer que je souhaite qu'un élément "style : fixed" particulier sur un site donné soit affiché plutôt que caché, mais je n'en connais pas).