jquery.nicescroll用法

一定要放在 $(document).ready 中進(jìn)行初始化朝聋!
// 1. 最簡(jiǎn)單的用法如下:
$(document).ready(function() {  
    $("html").niceScroll();
});

// 2. Instance with object returned:
var nice = false;
$(document).ready(function() {  
    nice = $("html").niceScroll();
});

// 3. 設(shè)置DIV并更改光標(biāo)顏色:
$(document).ready(function() {  
    $("#thisdiv").niceScroll({cursorcolor:"#00F"});
});

// 4. DIV with "wrapper", formed by two divs, the first is the vieport, the latter is the content:
$(document).ready(function() {
    $("#viewportdiv").niceScroll("#wrapperdiv",{cursorcolor:"#00F"});
});

// 5. 獲取nicescroll對(duì)象:
var nice = $("#mydiv").getNiceScroll();

// 6. 隱藏滾動(dòng)條:
$("#mydiv").getNiceScroll().hide();

// 7. 檢查滾動(dòng)條大屑洹(內(nèi)容或位置發(fā)生變化時(shí)):
$("#mydiv").getNiceScroll().resize();

// 8. 滾動(dòng)到某個(gè)位置:
$("#mydiv").getNiceScroll(0).doScrollLeft(x, duration); // Scroll X Axis
$("#mydiv").getNiceScroll(0).doScrollTop(y, duration); // Scroll Y Axis
當(dāng)您調(diào)用“niceScroll”時(shí)结序,您可以將一些參數(shù)重新配置傳遞:
$("#thisdiv").niceScroll({
        cursorcolor: "#424242", // 改變滾動(dòng)條顏色,使用16進(jìn)制顏色值
        cursoropacitymin: 0, // 當(dāng)滾動(dòng)條是隱藏狀態(tài)時(shí)改變透明度, 值范圍 1 到 0
        cursoropacitymax: 1, // 當(dāng)滾動(dòng)條是顯示狀態(tài)時(shí)改變透明度, 值范圍 1 到 0
        cursorwidth: "5px", // 滾動(dòng)條的寬度刚盈,單位:便素
        cursorborder: "1px solid #fff", // CSS方式定義滾動(dòng)條邊框
        cursorborderradius: "5px", // 滾動(dòng)條圓角(像素)
        zindex: "auto" | <number>, // 改變滾動(dòng)條的DIV的z-index值
        scrollspeed: 60, // 滾動(dòng)速度
        mousescrollstep: 40, // 鼠標(biāo)滾輪的滾動(dòng)速度 (像素)
        touchbehavior: false, // 激活拖拽滾動(dòng)
        hwacceleration: true, // 激活硬件加速
        boxzoom: false, // 激活放大box的內(nèi)容
        dblclickzoom: true, // (僅當(dāng) boxzoom=true時(shí)有效)雙擊box時(shí)放大
        gesturezoom: true, // (僅 boxzoom=true 和觸屏設(shè)備時(shí)有效) 激活變焦當(dāng)out/in(兩個(gè)手指外張或收縮)
        grabcursorenabled: true // (僅當(dāng) touchbehavior=true) 顯示“抓住”圖標(biāo)display "grab" icon
        autohidemode: true, // 隱藏滾動(dòng)條的方式, 可用的值: 
          true | // 無(wú)滾動(dòng)時(shí)隱藏
          "cursor" | // 隱藏
          false | // 不隱藏,
          "leave" | // 僅在指針離開(kāi)內(nèi)容時(shí)隱藏
          "hidden" | // 一直隱藏
          "scroll", // 僅在滾動(dòng)時(shí)顯示        
        background: "", // 軌道的背景顏色
        iframeautoresize: true, // 在加載事件時(shí)自動(dòng)重置iframe大小
        cursorminheight: 32, // 設(shè)置滾動(dòng)條的最小高度 (像素)
        preservenativescrolling: true, // 你可以用鼠標(biāo)滾動(dòng)可滾動(dòng)區(qū)域的滾動(dòng)條和增加鼠標(biāo)滾輪事件
        railoffset: false, // 可以使用top/left來(lái)修正位置
        bouncescroll: false, // (only hw accell) 啟用滾動(dòng)跳躍的內(nèi)容移動(dòng)
        spacebarenabled: true, // 當(dāng)按下空格時(shí)使頁(yè)面向下滾動(dòng)
        railpadding: { top: 0, right: 0, left: 0, bottom: 0 }, // 設(shè)置軌道的內(nèi)間距
        disableoutline: true, // 當(dāng)選中一個(gè)使用nicescroll的div時(shí)仪糖,chrome瀏覽器中禁用outline
        horizrailenabled: true, // nicescroll可以管理水平滾動(dòng)
        railalign: right, // 對(duì)齊垂直軌道
        railvalign: bottom, // 對(duì)齊水平軌道
        enabletranslate3d: true, // nicescroll 可以使用CSS變型來(lái)滾動(dòng)內(nèi)容
        enablemousewheel: true, // nicescroll可以管理鼠標(biāo)滾輪事件
        enablekeyboard: true, // nicescroll可以管理鍵盤(pán)事件
        smoothscroll: true, // ease動(dòng)畫(huà)滾動(dòng)
        sensitiverail: true, // 單擊軌道產(chǎn)生滾動(dòng)
        enablemouselockapi: true, // 可以用鼠標(biāo)鎖定API標(biāo)題 (類(lèi)似對(duì)象拖動(dòng))
        cursorfixedheight: false, // 修正光標(biāo)的高度(像素)
        hidecursordelay: 400, // 設(shè)置滾動(dòng)條淡出的延遲時(shí)間(毫秒)
        directionlockdeadzone: 6, // 設(shè)定死區(qū),為激活方向鎖定(像素)
        nativeparentscrolling: true, // 檢測(cè)內(nèi)容底部便于讓父級(jí)滾動(dòng)
        enablescrollonselection: true, // 當(dāng)選擇文本時(shí)激活內(nèi)容自動(dòng)滾動(dòng)
        cursordragspeed: 0.3, // 設(shè)置拖拽的速度
        rtlmode: "auto", // DIV的水平滾動(dòng)從左邊開(kāi)始
        cursordragontouch: false, // 使用觸屏模式來(lái)實(shí)現(xiàn)拖拽
        oneaxismousemode: "auto", // 當(dāng)只有水平滾動(dòng)時(shí)可以用鼠標(biāo)滾輪來(lái)滾動(dòng)忙上,如果設(shè)為false則不支持水平滾動(dòng)拷呆,如果設(shè)為auto支持雙軸滾動(dòng)
        scriptpath: "" // 為boxmode圖片自定義路徑 ("" => same script path)
        preventmultitouchscrolling: true // 防止多觸點(diǎn)事件引發(fā)滾動(dòng)
    });

官網(wǎng)地址:http://www.areaaperta.com/nicescroll/

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個(gè)濱河市晨横,隨后出現(xiàn)的幾起案子洋腮,更是在濱河造成了極大的恐慌,老刑警劉巖手形,帶你破解...
    沈念sama閱讀 211,265評(píng)論 6 490
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件啥供,死亡現(xiàn)場(chǎng)離奇詭異,居然都是意外死亡库糠,警方通過(guò)查閱死者的電腦和手機(jī)伙狐,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,078評(píng)論 2 385
  • 文/潘曉璐 我一進(jìn)店門(mén),熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái)瞬欧,“玉大人贷屎,你說(shuō)我怎么就攤上這事∷一ⅲ” “怎么了唉侄?”我有些...
    開(kāi)封第一講書(shū)人閱讀 156,852評(píng)論 0 347
  • 文/不壞的土叔 我叫張陵,是天一觀的道長(zhǎng)野建。 經(jīng)常有香客問(wèn)我属划,道長(zhǎng)恬叹,這世上最難降的妖魔是什么? 我笑而不...
    開(kāi)封第一講書(shū)人閱讀 56,408評(píng)論 1 283
  • 正文 為了忘掉前任同眯,我火速辦了婚禮绽昼,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘须蜗。我一直安慰自己硅确,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 65,445評(píng)論 5 384
  • 文/花漫 我一把揭開(kāi)白布明肮。 她就那樣靜靜地躺著菱农,像睡著了一般。 火紅的嫁衣襯著肌膚如雪柿估。 梳的紋絲不亂的頭發(fā)上大莫,一...
    開(kāi)封第一講書(shū)人閱讀 49,772評(píng)論 1 290
  • 那天,我揣著相機(jī)與錄音官份,去河邊找鬼只厘。 笑死,一個(gè)胖子當(dāng)著我的面吹牛舅巷,可吹牛的內(nèi)容都是我干的羔味。 我是一名探鬼主播,決...
    沈念sama閱讀 38,921評(píng)論 3 406
  • 文/蒼蘭香墨 我猛地睜開(kāi)眼钠右,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼赋元!你這毒婦竟也來(lái)了?” 一聲冷哼從身側(cè)響起飒房,我...
    開(kāi)封第一講書(shū)人閱讀 37,688評(píng)論 0 266
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤搁凸,失蹤者是張志新(化名)和其女友劉穎,沒(méi)想到半個(gè)月后狠毯,有當(dāng)?shù)厝嗽跇?shù)林里發(fā)現(xiàn)了一具尸體护糖,經(jīng)...
    沈念sama閱讀 44,130評(píng)論 1 303
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 36,467評(píng)論 2 325
  • 正文 我和宋清朗相戀三年嚼松,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了嫡良。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點(diǎn)故事閱讀 38,617評(píng)論 1 340
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡献酗,死狀恐怖寝受,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情罕偎,我是刑警寧澤很澄,帶...
    沈念sama閱讀 34,276評(píng)論 4 329
  • 正文 年R本政府宣布,位于F島的核電站,受9級(jí)特大地震影響甩苛,放射性物質(zhì)發(fā)生泄漏忙干。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 39,882評(píng)論 3 312
  • 文/蒙蒙 一浪藻、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧乾翔,春花似錦爱葵、人聲如沸。這莊子的主人今日做“春日...
    開(kāi)封第一講書(shū)人閱讀 30,740評(píng)論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)。三九已至雷则,卻和暖如春辆雾,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背月劈。 一陣腳步聲響...
    開(kāi)封第一講書(shū)人閱讀 31,967評(píng)論 1 265
  • 我被黑心中介騙來(lái)泰國(guó)打工度迂, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人猜揪。 一個(gè)月前我還...
    沈念sama閱讀 46,315評(píng)論 2 360
  • 正文 我出身青樓惭墓,卻偏偏與公主長(zhǎng)得像,于是被迫代替她去往敵國(guó)和親而姐。 傳聞我的和親對(duì)象是個(gè)殘疾皇子腊凶,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 43,486評(píng)論 2 348

推薦閱讀更多精彩內(nèi)容

  • Spring Cloud為開(kāi)發(fā)人員提供了快速構(gòu)建分布式系統(tǒng)中一些常見(jiàn)模式的工具(例如配置管理,服務(wù)發(fā)現(xiàn)拴念,斷路器钧萍,智...
    卡卡羅2017閱讀 134,629評(píng)論 18 139
  • Android 自定義View的各種姿勢(shì)1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 171,749評(píng)論 25 707
  • Spring Boot 參考指南 介紹 轉(zhuǎn)載自:https://www.gitbook.com/book/qbgb...
    毛宇鵬閱讀 46,773評(píng)論 6 342
  • 你好,如果你喜歡心理學(xué)的話政鼠,我認(rèn)真告訴你风瘦,你女朋友的性格是敏感多疑,多愁善感公般,非常缺乏安全感的人弛秋,是九型人格中的六...
    騷里騷氣小可愛(ài)閱讀 264評(píng)論 0 0
  • 春節(jié)一過(guò),我就二十八歲啦俐载,虛齡時(shí)代嘛蟹略,我可以說(shuō)自己今年二十七,或者看著身份證不要臉的說(shuō)自己二十七遏佣。我卻不是那種特別...
    Jameson李墨白閱讀 215評(píng)論 1 2