Couleur des barres de défilement du navigateur
Fonctionne sur Internet Explorer à partir de 5,5.
Comme il s'agit simplement de code CSS, s'il ne fonctionne pas il ne dérange en rien la visualisation des pages et par contre IE est le plus utilisé.
Code dans HEAD
<STYLE TYPE='text/css'>
BODY
{
scrollbar-face-color: #0099FF ;
scrollbar-track-color: #00FFFF ;
scrollbar-arrow-color: #FF0000 ;
scrollbar-shadow-color: " ;
scrollbar-highlight-color: " ;
scrollbar-3dlight-color: " ;
scrollbar-darkshadow-color: " ;
}
</STYLE>
Représentation
graphique
Explications
Vous pouvez utiliser soit les valeurs hexadécimales soit le nom des couleurs en anglais.
scrollbar-face-color : #0099FF ;
= couleur de la barre de défilement ou ascenseur. (bleu foncé)
scrollbar-track-color: #00FFFF ;
= couleur du fond de la barre sur laquelle défile l'ascenseur. (bleu clair)
scrollbar-arrow-color: #FF0000 ;
= couleur des flèches en bout des barres de défilement. (rouge)
scrollbar-shadow-color: " ;
= couleur encadrement bas et droite de l'ascenseur.
scrollbar-highlight-color: " ;
= couleur encadrement haut et gauche de l'ascenseur.
scrollbar-3dlight-color: " ;
= effet 3D des flèches.
scrollbar-darkshadow-color: " ;
= couleur de bordure de la barre.
Suggestions
A l'évidence pour ne pas distraire votre visiteur et au contraire lui apporter un confort supplémentaire de navigation, accordez les couleurs de vos barres de défilement avec le fond de votre page.
Sachez aussi que si le navigateur ne comprend pas ce code, le visiteur n'en sera ni informé ni pénalisé.
Enfin je préconise l'utilisation de seulement les trois lignes de code (en bleu) sous peine de transformer votre page de navigation en sapin de Noël ce qui serait dommage. Pour cela il suffit de ne pas les placer dans le source ou sinon de remplacer le code de couleur :#FF000000; par : " ;
Pour une utilisation sur tout un site il est souhaitable de placer ce code dans un fichier "externe" CSS afin de ne pas avoir à le recopier chaque fois, bien qu'il soit très léger.
Par contre personnellement je me contente de ce code simplifié qui donne d'excellents résultats y compris de contraste :
<style type="text/css">
scrollbar-base-color: #999966 ;
</style>
Palette couleurs
Inutile de chercher des couleurs excentriques qui ne seront peut-être pas reproduites fidèlement par votre navigateur et, voici une palette de couleurs qui me semble suffisante.
Cliquez une couleur et récupérez le code. Sinon ! voir les nombreuses palettes (y compris couleurs en anglais) que je présente là dans une nouvelle page de navigateur qui va s'ouvrir.
