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

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

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

样式代码我们在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. Repeater 绑定数据是根据数据修改行的颜色值信息

    <ItemTemplate> <tr <%# Eval("dayu20").ToString()=="0"? "style=' ...

  2. 发布jar包到远程仓库 (maven deploy)

    背景: 项目有开放服务模块,现有个需求,需要把开放服务提供成一个jar包,用户可以直接对接. 流程: 1.在pom.xml文件添加distributionManagement节点,将项目打包上传到私服 ...

  3. 关于不同平台、环境下64位int型的输入输出方式(转)

    C语言 64位int 定义方式: Linux: long long         Windows:__int64 C语言 64位int 输出方式: Linux: "%lld"   ...

  4. mysql 的存储过程

    定义不带参数的存储过程 CREATE PROCEDURE s1() BEGINselect * from ecs_admin_action;End call s1; 2.带输入参数的 create P ...

  5. GRU简介

    一.GRU介绍 GRU是LSTM网络的一种效果很好的变体,它较LSTM网络的结构更加简单,而且效果也很好,因此也是当前非常流形的一种网络.GRU既然是LSTM的变体,因此也是可以解决RNN网络中的长依 ...

  6. ARP协议:网络世界的临门一脚

    大家好,我是风筝. 各位同学肯定见过关于网络的面试题,什么TCP协议和UDP的区别啦,IP协议工作在哪层啊等等,这都是网络中定义的各种协议.这些标准化的协议就是网络分层模型标准化的核心部分.要想搞懂网 ...

  7. Unity Joint用法及案例

    目录 什么是Joint 有哪些Joint Joint计算原理 自由度配置 Axis与Anchor Limit与Spring Drive与Target Joint应用案例 车轮 旋转 悬挂系统 吊臂 旋 ...

  8. 【深入浅出 Yarn 架构与实现】5-2 Yarn 三种调度器

    本篇文章将深入介绍 Yarn 三种调度器.Yarn 本身作为资源管理和调度服务,其中的资源调度模块更是重中之重.下面将介绍 Yarn 中实现的调度器功能,以及内部执行逻辑. 一.简介 Yarn 最主要 ...

  9. GO实现Redis:GO实现Redis的AOF持久化(4)

    将用户发来的指令以RESP协议的形式存储在本地的AOF文件,重启Redis后执行此文件恢复数据 https://github.com/csgopher/go-redis 本文涉及以下文件: redis ...

  10. Duplicate File Finder Pro - 重复文件查找器,给你的 Mac 清理出大量磁盘空间

    重复文件查找器 Duplicate File Finder Pro 是一个实用程序,只需3次点击就能在Mac上找到重复的文件.拖放功能和尽可能多的文件夹,你想,然后按下扫描按钮.在一分钟,应用程序将给 ...