开发小程序时,经常会碰到页面长度超过屏幕高度,然后下拉时会出现滚动条,对于一些有强迫症的人来说是不可忍受的。

网上看了好多,写的。都评论有起作用或者不起作用的。

我在这分享一个全局隐藏滚动条的方式。

样式代码我们在app.wxss中,写一个类选择器:

.contain {
height: 100vh;
width: 100vw;
padding: 0;
margin: 0;
background-color: #F2F5FF;
overflow-y: scroll;
} /* 不显示滚动条 */
.contain::-webkit-scrollbar {
display: none;
}

  

然后我们只要在每个页面的最外围,加一个class为contain的view包裹页面内容就行了,

备注:原本我使用page标签选择器来全局定义页面初始样式的。但是发现隐藏不起效果。还是需要在最外围用一个view来包裹页面内容。

微信小程序隐藏页面滚动条的更多相关文章

  1. 微信小程序去除页面滚动条

    ::-webkit-scrollbar { width: 0; height: 0; color: transparent; display: none; } 父级元素(滚动的元素) width:10 ...

  2. 微信小程序前端页面书写

    微信小程序前端页面书写 WXML(WeiXin Markup Language)是框架设计的一套标签语言,结合基础组件.事件系统,可以构建出页面的结构. 一.数据绑定 1. 普通写法 <view ...

  3. 微信小程序:页面配置 page.json

    微信小程序:页面配置 page.json 一.页面配置 page.json 如果整个小程序的风格是蓝色调,那么可以在 app.json 里边声明顶部颜色是蓝色即可. 实际情况可能不是这样,可能你小程序 ...

  4. 微信小程序开发--页面结构

    一.微信小程序开发--页面文件组成 [page.name].js 页面逻辑文件,用于创建页面对象,以及处理页面生命周期控制和数据处理 [page.name].wxml wxml指的是Wei Xin M ...

  5. 图解微信小程序---实现页面的跳转与返回操作

    图解微信小程序---实现页面的跳转与返回操作 代码笔记 操作步骤 第一步:在app.json配置文件中,创建跳转页面 第二步:编写首页跳转(注意跳转方式,和设置点击样式类名) 第三步:编写首页样式 第 ...

  6. 微信小程序-隐藏和显示自定义的导航

    微信小程序中不能直接操作window对象,document文档,跟html的树结构不相同. 实现类似导航的隐藏显示,如图效果: 点击网络显示或隐藏网络中包含的内容.其他类似. 如果是jquery很方便 ...

  7. 微信小程序WXML页面常用语法(讲解+示例)

    (一) WXML 是什么 官方说明:WXML(WeiXin Markup Language)是框架设计的一套标签语言,结合基础组件.事件系统,可以构建出页面的结构 在前面我们就已经提过,WXML,就可 ...

  8. 微信小程序之页面路由

    路由方式 简介 对于路由的触发方式以及页面生命周期函数如下: 路由方式 触发时机 路由前页面 路由后页面 初始化 小程序打开的第一个页面   onLoad, onSHow 打开新页面 调用 API w ...

  9. 微信小程序的页面渲染(if/for)

    下面,粗略的介绍一下微信小程序的条件渲染.列表渲染.数据绑定等,详细的内容大家可以去看微信小程序的API,在此只做简单描述,希望能帮助到大家 条件渲染 <!--wxml--> <vi ...

  10. 微信小程序之页面传值(路由、页面栈、globalData、缓存)

    1. 通过url带参数传递 1.1 固定参数传递 例如,从 list 页面到 detail 页面, 传递一个或多个固定值 list页面传值: <!--pages/list/list.js--&g ...

随机推荐

  1. K8S的基础概念

    一.Kubernetes介绍 1.什么是Kubernetes? Kubernetes(通常称为K8s,K8s是将8个字母"ubernete"替换为"8"的缩写) ...

  2. L02.从图灵机到通用计算机

    将程序载入到内存(存储器)中,用一个指针指向它, 再载入到cpu(控制器)中进行解释执行   *(取指执行,产生结果) 取指执行 = 控制器从存储器中取出数据后,分析指令,运算器执行逻辑运算. PC= ...

  3. [Leetcode 111]二叉树的最短深度 BFS/DFS

    题目 给定二叉树,求最短路径包含的节点个数 https://leetcode.com/problems/minimum-depth-of-binary-tree/ Given a binary tre ...

  4. pom.xml配置资源过滤

    <build> <!--设置资源过滤--> <resources> <resource> <directory>src/main/java& ...

  5. 读取nrf52832的ADC,并且获取N个数组中的中间值

    //****读取中间值****// short GetMedianNum(short * bArray, short iFilterLen) { short i,j,bTemp;// 排序循环 for ...

  6. spacy

    官方文档: https://spacy.io/api Spacy功能简介 可以用于进行分词,命名实体识别,词性识别等等,但是首先需要下载预训练模型 pip install --user spacy p ...

  7. 【javascript】chormeV8源码阅读之 GC(垃圾回收)过程 笔记

    1.为何需要垃圾回收     在V8引擎逐行执行JavaScript代码的过程中,当遇到函数的情况时,会为其创建一个函数执行上下文(Context)环境并添加到调用堆栈的栈顶,函数的作用域(handl ...

  8. Win10 下Cisco AnyConnect Secure Mobility Client问题(转)

    原文地址:http://blog.sina.com.cn/s/blog_66b9ff210102vup0.html            从WIN8升级到WIN10 ,Cisco AnyConnect ...

  9. selenium---xpath定位方法详解

    Xpath定位   验证xpath写的是否正确: 1.打开浏览器检查页面,Ctrl+F,把路径输入进去,如果可以定位到的位置只有一个,说明是对的 2.在需要定位的页面,按F12后,切换至console ...

  10. You need to run build with JDK or have tools.jar on the classpath.If this occures during eclipse build make sure you run eclipse under JDK as well 错误

    我打开项目报错是这样的  pom.xml jdk配置什么的都是好的    但是还是报错 解决错误 : 1.打开你eclipse的根目录,找到eclipse.ini  这个文件夹打开 2.打开是这个样子 ...