<script type="text/javascript" src="js/jquery-1.2.6.min.js"></script> <script type="text/javascript" src="js/jquery.mousewheel.js"></script> <script type="text/javascript" src="js/jquery.em.js"></script> <script type="text/javascript" src="js/jScrollPane.js"></script> <script type="text/javascript"> $(function() { // this initialises the demo scollpane on the page. $('#pane1').jScrollPane(); }); </script>
常用的參數配置項
1、showArrows:是否顯示滾動箭頭,模式是false;
2、maintainPosition:當滾動區重新初始化后,是否保持滾動條的原有位置,默認是true;
3、stickToBottom:當maintainPosition設置為true,且滾動區域到達底部,當有新內容添加的時候任然會固定在滾動區域底部,默認是false;
4、stickToRight:與stickToBottom屬性原理類似,只是方向是右側而不是底部;
5、autoReinitialise:自動初始化滾動區,內部實現機制實際上是一個定時器,當檢測到內部有內容新增時,重新初始化,由於性能原因,默認false;
6、autoReinitialiseDelay:當autoReinitialise設置為true時,該屬性表示自動初始化的延時,默認是500ms;
7、verticalDragMinHeight:垂直可拖動的最小高度,默認是0;
8、verticalDragMaxHeight:垂直可拖動的最大高度,默認是99999;
9、horizontalDragMinWidth:水平可拖動的最小距離,默認是0;
10、horizontalDragMaxWidth:水平可拖動的最大距離,默認是99999;
11、contentWidth:滾動區域的寬度,一般不要設置,該插件會根據內容實際寬度計算,默認undefined;
12、animateScroll:當調用scrollTo 或者scrollBy的時候,設置一個動畫效果,包括時長duration和漸變ease,默認false;
13、animateDuration:動畫時長,默認300ms;
14、animateEase:動畫漸變函數,默認linear;
15、hijackInternalLinks:劫持錨鏈接,定位到滾動區域指定位置,默認false;
16、verticalGutter:垂直方向,內容和滾動條之間的距離,默認是4px;
17、horizontalGutter:水平方向,內容和滾動條之間的距離,默認是4px;
18、mouseWheelSpeed:鼠標滾輪的速度,默認是10px;
19、arrowButtonSpeed:方向按鈕滾動內容的速度,默認是10px;
20、arrowRepeatFreq:按住方向按鈕,內容滾動的頻率,默認是100ms;
21、arrowScrollOnHover:當鼠標懸浮在方向按鈕上時,是否允許滾動,默認false;
22、verticalArrowPositions:垂直方向按鈕和固定點的位置,默認split;
23、horizontalArrowPositions:同上,水平方向;
24、enableKeyboardNavigation:是否允許鍵盤導航,默認true;
25、hideFocus:是否隱藏焦點框,默認false;
26、clickOnTrack:當點擊固定點的時候,是否向相應方向滾動內容,默認true;
27、trackClickSpeed:點擊固定點的滾動速度,默認是30px;
28、trackClickRepeatFreq:點擊固定點的滾動頻率,默認是100ms。
如果要修改滾動條的默認樣式可以打開jquery.jscrollpane.css文件修改