Personalizzare Scrollbar

« Older   Newer »
 
  Share  
.
  1.  
    .
    Avatar

    Member
    ★★★

    Group
    Boss
    Posts
    391
    Reputation
    +1

    Status
    Anonymes!
    Funziona solo con Chrome e Safari



    In cima al forum

    CODICE
    <style type="text/css">::-webkit-scrollbar {height: ALTEZZApx;

    width: LARGHEZZApx;

    background-image:url(IMMAGINE_DI_SFONDO)}::-webkit-scrollbar-thumb {background: #COLORE_SCROLL;

    border: LARGHEZZA_BORDO solid #COLORE_BORDO;

    border-radius: ARROTONDAMENTOex;

    box-shadow: 0 0 0 rgba(0, 0, 0, 0.75)}::-webkit-scrollbar-corner {background: #transparent}</style>



    Le parti che potete modificare sono:
    - ALTEZZA e LARGHEZZA della barra (ovviamente con valori numerici)
    - IMMAGINE_DI_SFONDO con l'url di un'immagine (meglio che sia un pattern) che volete come sfondo della scroll. Se preferite un colore allora sostituite

    CODICE
    background-image:url(IMMAGINE_DI_SFONDO)


    con questo, inserendo ovviamente il codice del colore

    CODICE
    background: #COLORE


    - COLORE_SCROLL con il codice del colore che volete che assuma la vostra scrollbar. Anche qui potete scegliere di avere invece un'immagine di sfondo sostituendo a

    CODICE
    background: #COLORE_SCROLL;


    questo, inserendo l'url dell'immagine

    CODICE
    background-image:url(IMMAGINE);


    - LARGHEZZA_BORDO e COLORE_BORDO. Se non volete il bordo impostate una larghezza pari a 0
    - ARROTONDAMENTO, inserite 0 per avere la barra rettangolare. Numeri più alti tenderanno a farvi avere bordi sempre più arrotondati.



    Prelevato da Glee forum
     
    .
0 replies since 14/10/2013, 23:43   10 views
  Share  
.