Notice
Recent Posts
Recent Comments
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | |||||
3 | 4 | 5 | 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 | 18 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | 28 | 29 | 30 |
Tags
- Jexcel
- 에덴미술
- 블로그 수익화
- samba
- IIS
- oralce
- .NET
- 국민연금
- Vista
- CSS
- Adobe pdf reader
- 소득세
- 블로그 조회수 늘리기
- CVS
- 즐겨찾기 추가
- MySQL
- JavaScript
- Eclipse
- HTML
- PHP
- MSSQL
- 블로그 조회수
- JSP
- 블루수국그림
- 블로그 방문자 늘리기
- flash
- 인테리어그림
- Administrator
- Jrun
- 갑근세
Archives
- Today
- Total
I LOVE EJ
jquery 스크롤바 본문
압축푸시고 jquery_custorm_scrollbar.html 여시면 테스트 화면과 동일합니다
열어보시면
제일 하단에 보시면 이부분이 컨트롤 부분입니다
function mCustomScrollbars(){
//malihu custom scrollbar function parameters:
//1) scroll type (values: "vertical" or "horizontal") //"#mcs5_container" 제일 하단 모델입니다
//2) scroll easing amount (0 for no easing) // 이동 방법입니다 값이 크면 클수록 시간이 이동 시간이 깁니다
//3) scroll easing type // jquery.easing.1.3.js 에 기능이 있습니다 easeInQuad , easeOutCirc ....
//4) extra bottom scrolling space for vertical scroll type only (minimum value: 1)// 수직 스크롤만 생깁니다 하단에 여백을 정의합니다
//5) scrollbar height/width adjustment (values: "auto" or "fixed") //스크롤을 고정으로 할지를 보여줍니다
//6) mouse-wheel support (values: "yes" or "no") //마우스 휠사용할것인지를 보여줍니다
//7) scrolling via buttons support (values: "yes" or "no") //수평 스크롤보시면 좌우 버튼을 사용할것인지를 알려줍니다
// 8) buttons scrolling speed (values: 1-20, 1 being the slowest) //버튼을 눌렀을때 이동시간을 정의합니다
$("#mcs_container").mCustomScrollbar("vertical",400,"easeOutCirc",1.05,"auto","yes","yes",10);
$("#mcs2_container").mCustomScrollbar("vertical",0,"easeOutCirc",1.05,"auto","yes","no",0);
$("#mcs3_container").mCustomScrollbar("vertical",900,"easeOutCirc",1.05,"auto","no","no",0);
$("#mcs4_container").mCustomScrollbar("vertical",200,"easeOutCirc",100,"fixed","yes","no",0);
$("#mcs5_container").mCustomScrollbar("horizontal",500,"easeOutCirc",1,"fixed","yes","yes",20);
}
열어보시면
제일 하단에 보시면 이부분이 컨트롤 부분입니다
function mCustomScrollbars(){
//malihu custom scrollbar function parameters:
//1) scroll type (values: "vertical" or "horizontal") //"#mcs5_container" 제일 하단 모델입니다
//2) scroll easing amount (0 for no easing) // 이동 방법입니다 값이 크면 클수록 시간이 이동 시간이 깁니다
//3) scroll easing type // jquery.easing.1.3.js 에 기능이 있습니다 easeInQuad , easeOutCirc ....
//4) extra bottom scrolling space for vertical scroll type only (minimum value: 1)// 수직 스크롤만 생깁니다 하단에 여백을 정의합니다
//5) scrollbar height/width adjustment (values: "auto" or "fixed") //스크롤을 고정으로 할지를 보여줍니다
//6) mouse-wheel support (values: "yes" or "no") //마우스 휠사용할것인지를 보여줍니다
//7) scrolling via buttons support (values: "yes" or "no") //수평 스크롤보시면 좌우 버튼을 사용할것인지를 알려줍니다
// 8) buttons scrolling speed (values: 1-20, 1 being the slowest) //버튼을 눌렀을때 이동시간을 정의합니다
$("#mcs_container").mCustomScrollbar("vertical",400,"easeOutCirc",1.05,"auto","yes","yes",10);
$("#mcs2_container").mCustomScrollbar("vertical",0,"easeOutCirc",1.05,"auto","yes","no",0);
$("#mcs3_container").mCustomScrollbar("vertical",900,"easeOutCirc",1.05,"auto","no","no",0);
$("#mcs4_container").mCustomScrollbar("vertical",200,"easeOutCirc",100,"fixed","yes","no",0);
$("#mcs5_container").mCustomScrollbar("horizontal",500,"easeOutCirc",1,"fixed","yes","yes",20);
}
이미지 변경및 레이어변경은 jquery.mCustomScrolbar.css 파일에 있습니다
[출처] jquery 스크롤바|작성자 미니
'Web publishing > jQuery' 카테고리의 다른 글
[Library] zeroclipboard (0) | 2013.03.21 |
---|---|
[jQuery] stopPropagation, preventDefault, return false 간의 차이점 (0) | 2013.03.20 |
자바스크립트 소스 (0) | 2013.02.27 |
구글 jquery 이용 (0) | 2011.09.23 |
jquery , prototype 충돌 방지 (같이 사용 하는 방법) (0) | 2010.11.23 |