資訊專欄INFORMATION COLUMN
這幾天做項目遇到了一個關(guān)于nicescroll插件在容器寬度改變時，滾動條的位置沒有改變這個問題，貼出自己的解決方案，希望能對遇到和我一樣問題的朋友們有所幫助。
問題描述：如圖，這個是我nicescroll自定義樣式的滾動條
當(dāng)我點擊這個如圖標(biāo)注的這個圖標(biāo)后，左側(cè)菜單會收起來
左側(cè)菜單收起來后，底部菜單的定位要變成left:0;同時底部菜單的寬度要在原有基礎(chǔ)上加上左側(cè)菜單的寬度（就相當(dāng)于底部菜單的定位和寬度都改變了），但是如圖，我的滾動條并沒有隨著我容器寬度的改變而改變。
代碼問題代碼是這樣寫的：
1.js部分
2.css部分
容器一定要寫寬高，要寫上overflow: auto;
3.html部分
改正后的代碼你的內(nèi)容
1.js部分
boxzoom最好設(shè)置為false，不然雙擊容器時，容器中的內(nèi)容會放大，朋友們可以換成true感受下效果。
nicescroll插件的下載地址：https://github.com/inuyaksa/j...。
建議親下載3.7.6這個demo,如圖所示，這里面包含使用nicescroll需要引用的js,以及簡單常用的例子。
2.css部分
3.html部分
結(jié)束語你的內(nèi)容
寫到這里，問題就解決好了。感謝朋友們的閱讀，希望對大家有所幫助！
文章中有什么錯誤的地方希望朋友們能夠幫我指正！
歡迎大家留言，如果我有寫的不詳細的地方歡迎提問，我會盡快回復(fù)的！
謝謝！
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://specialneedsforspecialkids.com/yun/93061.html
摘要：使用了很多的滾動條插件，如這次說說，支持水平滾動條，支持文本區(qū)和文檔頁面滾動條。，兼容所有的桌面瀏覽器。，兼容移動設(shè)備黑莓手機和芒果。，兼容所有觸摸設(shè)備平板電腦窗口接口。，簡單的安裝和激活不破壞代碼。 使用了很多的滾動條插件，如Iscroll,swiper,這次說說Nicescroll 1，支持水平滾動條! 2，支持div,IFrames,文本區(qū)和文檔頁面滾動條。 3，兼容所有的桌面...
摘要：定位的起始位置為此元素原先在檔流的位置。忽略和從父元素繼承該屬性的值以上的和可以使得元素脫離文檔流。絕對定位脫離檔流的布局，遺留下來的空間由后的元素填充。默認定位表示此元素為默認定位式。 Position（定位） position可以取五個值 參數(shù) 描述 absolute 絕對定位；脫離?檔流的布局，遺留下來的空間由后?的元素填充。定位的起始位置為最近的?元素(postio...
摘要：實戰(zhàn)之微信錢包騰訊服務(wù)界面網(wǎng)格布局是讓開發(fā)人員設(shè)計一個網(wǎng)格并將內(nèi)容放在這些網(wǎng)格內(nèi)。對于移動端適配，不同的公司不同的團隊有不同的解決方案。柵格系統(tǒng)用于處理頁面多終端適配的問題。 grid實戰(zhàn)之微信錢包 騰訊服務(wù)界面 CSS3網(wǎng)格布局是讓開發(fā)人員設(shè)計一個網(wǎng)格并將內(nèi)容放在這些網(wǎng)格內(nèi)。而不是使用浮動制作一個網(wǎng)格，實際上是你將一個元素聲明為一個網(wǎng)格容器，并把元素內(nèi)容置于網(wǎng)格中。 移動端頁面適配—...
摘要：一般地，一個塊盒的內(nèi)容都被限制在該盒的邊內(nèi)。這種盒并不一定會根據(jù)其祖先的屬性裁剪。默認情況下，元素不會被裁剪。在閉合路徑內(nèi)的內(nèi)容會顯示，而路徑外邊的都會被剪掉著作權(quán)歸作者所有。 Overflow and clipping 一般地，一個塊盒的內(nèi)容都被限制在該盒的content邊內(nèi)。某些情況下，一個盒可能會溢出，意味著它的部分內(nèi)容或者全部內(nèi)容位于該盒外部，例如： 一行無法拆分，導(dǎo)致行盒比...
閱讀 3835·2021-11-24 09:39
閱讀 3753·2021-11-22 12:07
閱讀 1105·2021-11-04 16:10
閱讀 798·2021-09-07 09:59
閱讀 1902·2019-08-30 15:55
閱讀 935·2019-08-30 15:54
閱讀 724·2019-08-29 14:06
閱讀 2475·2019-08-27 10:54
