2012-09-05 4 views
0

Firefox에서 제대로 작동하는 것처럼 보이는 사용자 정의 스크롤 막대를 만들었지 만 Webkit 브라우저의 화면에 내 스크롤에 나타나는 문제가 있습니다. Click herewebkit 브라우저에서 사용자 정의 css 스크롤 막대 문제

#product-desc{ 
     top: 270px; 
     left: 20px; 
     right: 20px; 
     bottom: 20px; 
     height: 90px; 
     max-width: 350px; 
     overflow-x: hidden; 
     overflow-y: scroll; 
    } 


    #product-desc :: -webkit-scrollbar{ 
     width: 12px; 
    } 

    #product-desc :: -webkit-scrollbar-track{ 
     border-radius: 10px; 
     -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 
    } 

    #product-desc :: -webkit-scrollbar-thumb{ 
     border-radius: 10px; 
     -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
     color: #000; 
     } 

사람은 내가이 문제를 해결할 수있는 방법을 알고 있나요?

+0

사용자 정의 스크롤 막대가 * 초 * 좋은 생각이다를 통해 당신도 갈 수 Custom Scrollbars in WebKit

에 모습을 가질 수 있고, 당신이 그들을 피해야한다. – meagar

+0

그 이유는 무엇입니까? 대부분의 브라우저에서 지원되지 않습니까? – NewBoy

+0

스크롤 영역 내 스크롤 영역 사용자 경험이 정말 끔찍하기 때문입니다. 브라우저 창에 이미 스크롤 막대가 있습니다. 당신은 그 일을하도록해야합니다. – meagar

답변

0

이들은 의사 요소 자체입니다. 스크롤 바의 실제 부분입니다.

::-webkit-scrollbar    { /* 1 */ } 
::-webkit-scrollbar-button  { /* 2 */ } 
::-webkit-scrollbar-track  { /* 3 */ } 
::-webkit-scrollbar-track-piece { /* 4 */ } 
::-webkit-scrollbar-thumb  { /* 5 */ } 
::-webkit-scrollbar-corner  { /* 6 */ } 
::-webkit-resizer    { /* 7 */ } 

당신은 Styling scrollbars the Webkit way - CSS3

관련 문제