어떻게이 CSS 클래스를 정의하여 내가 HTML 웹 페이지를 모방 인라인 창을 설계하고 HTML/CSS/JScrollPane의

Question

를 사용하여 꽤 스크롤바를 만들 수 있습니다

.paneSection{ 
    display: block; 
    border-width: 1px; 
    border-style: solid; 
    margin: 2px; 
    padding:0px; 
    height:200px; 
    width:200px; 
    overflow: auto 
} 

와는 span 태그에 적용. 그 결과 코드는 다음과 같습니다.

문제는 표시되는 스크롤 막대가 추악하고 회색이며 상자가 많은 것입니다. 정말 "더 예쁜"스크롤바가 필요합니다. 몇 시간 동안 둘러 보았는데, 거의 모든 것이 JQuery 플러그인 JScrollPane을 사용하는 것으로 보인다. 그러나, 비록 내가 개발자 (웹 페이지의 HTML을 생성하기 위해 실제로 자바를 사용하고 있음)이지만 JQuery 나 플러그인을 사용 해본 적이 없다.

다른 페이지의 소스 코드로 약간 놀았지만 최소한의 효과는 있었지만 여전히 예쁜 것은 없었습니다. 이 말을 잘못하는 것은 사실이지만 스크롤바를 더 예쁘게 만들기 위해서는 실제 이미지 파일이 필요합니다.

나는이 페이지에 pane2의 하나입니다 좋아하는 일 스크롤의 예 : 나는 소스에서 참조하는 이미지를 얻을 수 http://www.kelvinluck.com/assets/jquery/jScrollPane/examples.html

은? 실제로 이미지를 만들 필요가 있습니까 아니면 다운로드 할 수 있습니까?

예쁜 스크롤바 디자인에 대한 다른 도움말 (저는 그래픽 디자이너가 아닙니다. 염두에 두십시오) 또는 일반적인 JQuery 플러그인을 사용하는 방법에 대해 높이 평가됩니다.

추가 정보 수직으로뿐만 아니라 수평으로 작업하려면 스크롤 막대가 필요합니다. 이것에 대해서 JScrollPane는 아직 정당한가요?

Answer 1

아니요 이미지를 가져올 수 있어야합니다. 예를 들어 화살표 중 하나는 http://www.kelvinluck.com/assets/jquery/jScrollPane/images/osx_arrow_up.png입니다.

가장 쉬운 방법은 브라우저의 검사기를 사용하는 것입니다 (Chrome 및 Safari에는이 기능이 내장되어 있으며 Firefox는 Firebug를 사용하며 IE에는 주석이 없습니다). 스크롤 막대 또는 스크롤 막대에서 이미지에 대해 관심있는 부분을 마우스 오른쪽 버튼으로 클릭하고 "요소 검사"를 수행하면됩니다. 거기에서 그 요소에 대한 CSS를 볼 수 있습니다.이 경우에는 background-image 속성을 사용하고 있으며 여기에서 URL을 가져올 수 있습니다.

그래픽 디자이너가 아닌 경우 작성자가 허용한다고 가정 할 때 이미 웹상에 이미있는 이미지를 찾을 수 있습니다. 일반적으로 jQuery의 경우 설명서가 무엇이 있는지 알고 싶습니다 (자바가 있다고 가정). 사용을 시작합니다. 이 경험은 훌륭한 교사입니다.