Gdesign.it :: Come progettare siti web accessibili ed efficaci ::


Home » How To » Scrollbar

Scrollbar

di GDesign, 20 Giugno 2002

Versione StampabileDownload in pdf


In questo articolo vedremo come colorare la barra di scorrimento del nostro browser. Poiché la possibilità di definire i colori della scroll bar si basa su alcune proprietà introdotte da Microsoft e non contemplate dalle specifiche del W3C, solo gli utenti che hanno Internet Explorer 5.5 o superiore vedranno la scroll bar personalizzata; tutti gli altri la vedranno nel suo aspetto "classico". I colori dei vari elementi della scroll bar si definiscono utilizzando i CSS. La sintassi da usare è del tipo:

BODY {
scrollbar-face-color:#293E4C;
scrollbar-highlight-color:#FFFFFF;
scrollbar-3dlight-color:#6A747A;
scrollbar-darkshadow-color:#3A444A;
scrollbar-shadow-color:#808080;
scrollbar-arrow-color:#E19218;
scrollbar-track-color:#D1D3D4;
}

I colori dell'esempio danno questo risultato:

Scrollbar

Vediamo nel dettaglio quali sono gli elementi della scroll bar che possiamo personalizzare:

Elementi scroll bar

Utilizzare questa tecnica non è affatto difficile ma vi voglio dare due consigli:

  1. scegliete i colori della vostra scroll bar cercando di mantenere l'effetto 3D che ha la scroll bar di default;
  2. non fatene abuso, ad esempio, non ha senso creare, una scroll bar diversa per ogni pagina del vostro sito.

Infine, vi segnalo Cool Web Scrollbars, un comodo editor visuale che genera il codice da inserire per creare la vostra scroll bar.

^Top

Dai un voto a questo articolo:   HITS: 224 | VOTI: | MEDIA VOTI:     

Home:: Html:: Principi:: How To:: Download:: Tips:: Link:: Collabora:: Partners:: News&Updates:: Contatto:: Info

© 2001 - 2006 Giuseppe Di Carlo :: Riproduzione vietata ::

Utenti on line: 3