Div Scrollbar - Stil oluşturmanın herhangi bir yolu var mı?

Question

Bir div etiketinin kaydırma çubuklarının stilini kontrol etmek için zaten var mı? IE7 ve FireFox 3.5.2 arasında bazı kontrast sorunları yaşıyorum. Herhangi bir yardım büyük takdir edilecektir!

Answer 1

Javascript kullanarak kaydırma çubuklarını stillayabilirsiniz. Hangi IE de FF gibi iyi çalışıyor.

Kontrol altına, Example 3

From Twinhelix , Example 2 bağlantılar [ya] aşağıdaki bağlantıyı 30 scrolling techniques

Answer 2

Hayır, Firefox'ta, Safari'de yapamazsınız. Internet Explorer'da yapabilirsiniz. Orada bir kaydırma çubuğu yapmanızı sağlayacak birkaç komut dosyası var.

Answer 3

This one does well its scrolling job tıklayın göre kaydırma stili türlerinden bazıları 30 türü bulabilirsiniz. Anlamak çok kolay, sadece çok az kod satırı, iyi yazılmış ve tamamen okunabilir.

Answer 4

Ayrıca, kaydırma çubuklarını şekillendirmenize ve dokunmatik aygıtlarla çalışmaya başlamanıza olanak veren iScroll projesi de vardır. http://cubiq.org/iscroll-4

Answer 5

Web'de gezinmek, kaydırma çubuklarını stillendirmenin basit bir yolunu bulurum.

Bu adam!

Ve burada benim uygulamam! https://dl.dropbox.com/u/1471066/cloudBI/cssScrollbars.png

/* Turn on a 13x13 scrollbar */ 
::-webkit-scrollbar { 
    width: 10px; 
    height: 13px; 
} 

::-webkit-scrollbar-button:vertical { 
    background-color: silver; 
    border: 1px solid gray; 
} 

/* Turn on single button up on top, and down on bottom */ 
::-webkit-scrollbar-button:start:decrement, 
::-webkit-scrollbar-button:end:increment { 
    display: block; 
} 

/* Turn off the down area up on top, and up area on bottom */ 
::-webkit-scrollbar-button:vertical:start:increment, 
::-webkit-scrollbar-button:vertical:end:decrement { 
    display: none; 
} 

/* Place The scroll down button at the bottom */ 
::-webkit-scrollbar-button:vertical:increment { 
    display: none; 
} 

/* Place The scroll up button at the up */ 
::-webkit-scrollbar-button:vertical:decrement { 
    display: none; 
} 

/* Place The scroll down button at the bottom */ 
::-webkit-scrollbar-button:horizontal:increment { 
    display: none; 
} 

/* Place The scroll up button at the up */ 
::-webkit-scrollbar-button:horizontal:decrement { 
    display: none; 
} 

::-webkit-scrollbar-track:vertical { 
    background-color: blue; 
    border: 1px dashed pink; 
} 

/* Top area above thumb and below up button */ 
::-webkit-scrollbar-track-piece:vertical:start { 
    border: 0px; 
} 

/* Bottom area below thumb and down button */ 
::-webkit-scrollbar-track-piece:vertical:end { 
    border: 0px; 
} 

/* Track below and above */ 
::-webkit-scrollbar-track-piece { 
    background-color: silver; 
} 

/* The thumb itself */ 
::-webkit-scrollbar-thumb:vertical { 
    height: 50px; 
    background-color: gray; 
} 

/* The thumb itself */ 
::-webkit-scrollbar-thumb:horizontal { 
    height: 50px; 
    background-color: gray; 
} 

/* Corner */ 
::-webkit-scrollbar-corner:vertical { 
    background-color: black; 
} 

/* Resizer */ 
::-webkit-scrollbar-resizer:vertical { 
    background-color: gray; 
}