Come creare barre di scorrimento personalizzate in IE?

Ho questa bella barra di scorrimento che funziona in Chrome e nelle ultime versioni di Safari. È possibile creare lo stesso tipo di barra di scorrimento per i browser IE 9+ utilizzando solo CSS3?Come creare barre di scorrimento personalizzate in IE?

.scrollbar 
{ 
    float: left; 
    height: 300px; 
    background: #F5F5F5; 
    overflow-y: scroll; 
    margin-bottom: 25px; 
} 

.scrollbar-active 
{ 
    min-height: 450px; 
} 

#scroll::-webkit-scrollbar-track 
{ 
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 
    background-color: #F5F5F5; 
} 

#scroll::-webkit-scrollbar 
{ 
    width: 10px; 
    background-color: #F5F5F5; 
} 

#scroll::-webkit-scrollbar-thumb 
{ 
    background-color: #000000; 
    border: 2px solid #555555; 
}

HTML

<div class="scrollbar" id="scroll"> 
    <div class="scrollbar-active"></div> 
</div>

http://jsfiddle.net/7gmut6w3/2/

fonte

2015-04-17 Prime

Queste sono le proprietà CSS è possibile utilizzare per regolare lo stile di barre di scorrimento IE:

body{ 
    scrollbar-base-color: #000; 
    scrollbar-face-color: #000; 
    scrollbar-3dlight-color: #000; 
    scrollbar-highlight-color: #000; 
    scrollbar-track-color: #000; 
    scrollbar-arrow-color: black; 
    scrollbar-shadow-color: #000; 
    scrollbar-dark-shadow-color: #000; 
}

Maggiori informazioni possono essere trovate here e here.

WORD OF CAUTION - La regolazione di un elemento nativo di un browser Web (come una barra di scorrimento) può introdurre tutti i tipi di casi limite e problemi di esperienza utente. Fai attenzione alle eventuali regolazioni apportate, assicurandoti che il vantaggio aggiuntivo delle barre di scorrimento personalizzate superi i problemi che presenterà.

fonte

2015-04-17 12:03:15

Solo per segnalare anche agli altri - sembra che non ci sia ancora modo di personalizzare la curva/il bordo della barra di scorrimento di IE. O per sbarazzarsi delle frecce in alto e in basso. – mmcrae

... o cambia il colore dei pollici indipendentemente dal colore del cursore. – Walkor

Sto andando con gli occhi strabici, o le prime due proprietà sono le stesse? – PieBie

se si impostano tutti gli elementi dell'area superiore sullo stesso colore della traccia, in pratica nasconderà la freccia, ma lo spazio sarà ancora lì.

scrollbar-track-color: #AAA; 
scrollbar-3dlight-color: #AAA; 
scrollbar-darkshadow-color: #AAA; 
scrollbar-arrow-color: #AAA;

ora se solo si potesse regolare la larghezza per rendere più stretta la barra di scorrimento !! qualcuno ha capito questo fuori?

fonte

2016-06-29 06:49:05

Questa è una soluzione eccellente per nascondere le brutte frecce della barra di scorrimento di Windows 8 senza dover codificare le barre di scorrimento da zero. Grazie per la condivisione –

Come creare barre di scorrimento personalizzate in IE?

risposta

Problemi correlati