微信小程序scroll-view隱藏滾動(dòng)條的方法詳解

更新時(shí)間：2020年03月25日 09:45:26 作者：追逐繁星D孩子

這篇文章主要介紹了微信小程序scroll-view隱藏滾動(dòng)條的方法，本文通過實(shí)例代碼給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下

效果圖：

1.scroll-view 中的需要滑動(dòng)的元素不可以用 float 浮動(dòng)使其一行展示；

2.包裹scroll-view的元素如果用 display:flex; 是沒有滾動(dòng)效果的；

3.scroll-view 中的需要滑動(dòng)的元素要用 dislay:inline-block; 進(jìn)行元素的橫向編排；

4.包裹 scroll-view 的元素要加上樣式–> overflow:hidden;white-space:nowrap;

5.有時(shí)候?yàn)榱嗣烙^要隱藏滾動(dòng)條，需要在樣式里加上

核心代碼：

在wxss里加入以下代碼

::-webkit-scrollbar{
  width: 0;
  height: 0;
  color: transparent;
}

scrollview屬性

總結(jié)

到此這篇關(guān)于微信小程序scroll-view隱藏滾動(dòng)條的方法詳解的文章就介紹到這了,更多相關(guān)小程序scroll-view隱藏滾動(dòng)條內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

您可能感興趣的文章:

相關(guān)文章

JS小游戲之象棋暗棋源碼詳解
這篇文章主要介紹了JS小游戲之象棋暗棋源碼詳解,對(duì)游戲源碼進(jìn)行了較為詳細(xì)的分析,并附帶完整實(shí)例代碼供大家學(xué)習(xí)參考,需要的朋友可以參考下
2014-09-09
修改ligerui 默認(rèn)確認(rèn)按鈕的方法
下面小編就為大家?guī)硪黄薷膌igerui 默認(rèn)確認(rèn)按鈕的方法。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
2016-12-12
不同Jquery版本引發(fā)的問題解決
用JS實(shí)現(xiàn)了一個(gè)拖拽排序，可因Jquery版本不同導(dǎo)致瀏覽器訪問時(shí)存在很多的問題，下面為大家介紹下具體的解決方法，感興趣的朋友可以參考下
2013-10-10
js中document.referrer實(shí)現(xiàn)移動(dòng)端返回上一頁
本文主要介紹了document.referrer實(shí)現(xiàn)移動(dòng)端返回上一頁的方法，具有很好的參考價(jià)值，下面跟著小編一起來看下吧
2017-02-02
uni-app 百度語音識(shí)別文字并展示功能實(shí)現(xiàn)
這篇文章主要介紹了uni-app 百度語音識(shí)別文字并展示功能實(shí)現(xiàn),本文主要寫的是 uniapp實(shí)現(xiàn)語音輸入并展示在頁面上,純前端,不涉及后端,需要的朋友可以參考下
2023-12-12
連續(xù)操作HTMLElement對(duì)象圖文解決方法
Object.prototype.***不能用作在HTMLElement對(duì)象上，如本后面的抓圖所示。
2008-03-03
JavaScript傳參的6種方式總結(jié)
js中的傳值方式,對(duì)于簡單類型(好比字符串和數(shù)值)就是值傳遞和引用傳遞,下面這篇文章主要給大家介紹了關(guān)于JavaScript傳參的6種方式,需要的朋友可以參考下
2023-03-03
javascript相等運(yùn)算符與等同運(yùn)算符詳細(xì)介紹
不管是java、c++、php都有相等運(yùn)算符與等同運(yùn)算符，當(dāng)然javasript也不例外，下面介紹一下
2013-11-11
Javascript設(shè)計(jì)模式之觀察者模式的多個(gè)實(shí)現(xiàn)版本實(shí)例
這篇文章主要介紹了Javascript設(shè)計(jì)模式之觀察者模式的多個(gè)實(shí)現(xiàn)版本實(shí)例,本文給出3種實(shí)現(xiàn)版本代碼,同時(shí)給出了Jquery實(shí)現(xiàn)版本,需要的朋友可以參考下
2015-03-03
js實(shí)現(xiàn)無縫輪播圖效果
這篇文章主要為大家詳細(xì)介紹了js實(shí)現(xiàn)無縫輪播圖效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2020-03-03