微信小程序scroll-view隐藏滚动条的方法详解


Posted in Javascript onMarch 25, 2020

效果图:

微信小程序scroll-view隐藏滚动条的方法详解

1.scroll-view 中的需要滑动的元素不可以用 float 浮动使其一行展示;

2.包裹scroll-view的元素如果用 display:flex; 是没有滚动效果的;

3.scroll-view 中的需要滑动的元素要用 dislay:inline-block; 进行元素的横向编排;

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

5.有时候为了美观要隐藏滚动条,需要在样式里加上

核心代码:

在wxss里加入以下代码

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

 scrollview属性

微信小程序scroll-view隐藏滚动条的方法详解

总结

到此这篇关于微信小程序scroll-view隐藏滚动条的方法详解的文章就介绍到这了,更多相关小程序scroll-view隐藏滚动条内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
很全的显示阴历(农历)日期的js代码
Jan 01 Javascript
基于jquery实现的一个选择中国大学的弹框 (数据、步骤、代码)
Jul 26 Javascript
运用JQuery的toggle实现网页加载完成自动弹窗
Mar 18 Javascript
如何用JavaScript定义一个类
Sep 12 Javascript
jQuery中[attribute]选择器用法实例
Dec 31 Javascript
JavaScript新增样式规则(推荐)
Jul 19 Javascript
移动端网页开发调试神器Eruda的介绍与使用技巧
Oct 30 Javascript
解决layui 三级联动下拉框更新时回显的问题
Sep 03 Javascript
微信小程序实现Swiper轮播图效果
Nov 22 Javascript
JS中数组实现代码(倒序遍历数组,数组连接字符串)
Dec 29 Javascript
vue使用原生swiper代码实例
Feb 05 Javascript
JS开发前端团队展示控制器来为成员引流
Aug 14 Javascript
微信小程序点击item使之滚动到屏幕中间位置
Mar 25 #Javascript
微信小程序scroll-view点击项自动居中效果的实现
Mar 25 #Javascript
微信小程序 flexbox layout快速实现基本布局的解决方案
Mar 24 #Javascript
安装多版本Vue-CLI的实现方法
Mar 24 #Javascript
js实现页面图片消除效果
Mar 24 #Javascript
js实现消灭星星(web简易版)
Mar 24 #Javascript
JavaScript实现移动端带transition动画的轮播效果
Mar 24 #Javascript
You might like
PHP中使用正则表达式提取中文实现笔记
2015/01/20 PHP
Codeigniter检测表单post数据的方法
2015/03/21 PHP
php文件上传、下载和删除示例
2020/08/28 PHP
PHP dirname功能及原理实例解析
2020/10/28 PHP
javascript 定义新对象方法
2010/02/20 Javascript
JavaScript 模块化编程(笔记)
2015/04/08 Javascript
jQuery操作dom实现弹出页面遮罩层(web端和移动端阻止遮罩层的滑动)
2016/08/25 Javascript
jQuery 的 ready()的纯js替代方法
2016/11/20 Javascript
JS实现的简易拖放效果示例
2016/12/29 Javascript
5分钟学会Vue动画效果(小结)
2018/07/21 Javascript
详解如何用VUE写一个多用模态框组件模版
2018/09/27 Javascript
javascript实现弹幕墙效果
2019/11/28 Javascript
vuejs中父子组件之间通信方法实例详解
2020/01/17 Javascript
解决vue net :ERR_CONNECTION_REFUSED报错问题
2020/08/13 Javascript
Node在Controller层进行数据校验的过程详解
2020/08/28 Javascript
前端性能优化建议
2020/09/17 Javascript
JS+JQuery实现无缝连接轮播图
2020/12/30 jQuery
[55:04]海涛DOTA2死魂复燃6.82版本介绍
2014/09/28 DOTA
Python的Asyncore异步Socket模块及实现端口转发的例子
2016/06/14 Python
python2 与 python3 实现共存的方法
2018/07/12 Python
Python 获取主机ip与hostname的方法
2018/12/17 Python
详解Python学习之安装pandas
2019/04/16 Python
树莓派4B+opencv4+python 打开摄像头的实现方法
2019/10/18 Python
详解mac python+selenium+Chrome 简单案例
2019/11/08 Python
python GUI库图形界面开发之PyQt5状态栏控件QStatusBar详细使用方法实例
2020/02/28 Python
Python修改列表值问题解决方案
2020/03/06 Python
Python 日期与时间转换的方法
2020/08/01 Python
利用Python优雅的登录校园网
2020/10/21 Python
html5 video全屏播放/自动播放的实现示例
2020/08/06 HTML / CSS
《走一步再走一步》教学反思
2014/02/15 职场文书
司机个人年终总结
2015/03/03 职场文书
回复函格式及范文
2015/07/14 职场文书
小学语文教师研修日志
2015/11/13 职场文书
2016教师国培研修感言
2015/12/08 职场文书
2016优秀大学生个人事迹材料范文
2016/03/01 职场文书
css实现左上角飘带效果的完整代码
2022/03/18 HTML / CSS