scroll-view占满整个屏幕，且scroll-view的滚动不影响到页面其他地方的滚动

在iphone6的尺寸下，scroll-view设置高度为1110rpx，就不会影响页面其他地方的滚动

但是当屏幕尺寸调至iphone5时，左边scroll-view的滚动，就会带动右边内容的滚动

而在iphone7 plus时，scroll-view不能占满整个屏幕

最后发现只需要将scroll-view的高度设置为 100vh 就可以解决这个问题

 <scroll-view scroll-y="true" style="height: 100vh"></scroll-view>

最终效果：

小程序给scroll-view设置高度，使得它能适配各种尺寸的手机的更多相关文章

  1. 微信小程序的button按钮设置宽度无效

    亲,你是不是也遇到了微信小程序的button按钮设置宽度无效.让我来告诉你怎么弄 方法1. 样式中加入!important,即:width: 100% !important; wxss代码示例 1 2 ...

  2. 微信小程序：scroll滑到指定位置

    概述 这是我开发微信小程序遇到的坑中的一个,专门记录下来,供以后开发时参考,相信对其他人也有用. scroll滑到指定位置,有两种解决方案,一种是用scroll-view标签,另一种是用wx.page ...

  3. 微信小程序 简单获取屏幕视口高度

    由于小程序的宽度是固定的 750rpx,我们可以先用wx.getSystemInfo 来获取可使用窗口的宽高(并非rpx),结合750rpx的宽度算出比例,再用比例来算出高度 let that = t ...

  4. 微信小程序 网络请求之设置合法域名

    设置域名 登录微信公众号后台小程序中 设置→开发设置→服务器设置 必须设置域名,微信小程序才能进行网络通讯,不然会报错 如果设置好了合法域名,开发工具还提示不在合法域名列表中,因为在微信会有一段时间的 ...

  5. 微信小程序之给项目设置id后提示不在合法域名列别中

    hotapp 有免费的https proxy ,可以免费代理请求任何http或者https服务,只要设置好合法域名为https://wxapi.hotapp.cn, 就可以请求网址如请求小程序联盟的例 ...

  6. 小程序开发基础-view视图容器

    view 视图容器. // wxml <view class="section"> <view class="section__title"& ...

  7. 微信小程序开发中怎么设置转发（分享）的信息

    如果什么都不设置,转发时默认名称是小程序的名称,转发的图片显示的是当前页面的截图,如图一 如何在自定义转发信息呢? 在进行转发的页面中: Page({ onShareAppMessage: funct ...

  8. 微信小程序中的tabBar设置

    我们先来看一份图,这个设置在官方文档中已经写得很清楚了,我只是做一个总结 注:我写注释是为了方便说明,在小程序中的json文件中是不能用注释的 这个tabBar属于全局属性,因此就在全局配置文件app ...

  9. 微信小程序图片宽度100%，高度自适应

    实现图片自适应,按照一般情况只需设置: img { width: 100%; height: auto; } 但是微信小程序里是特例,需要image标签上设置属性mode=widthFix,就是hei ...

随机推荐

  1. 虚拟机ubuntu18.04设置静态IP

    说明: 网关:192.168.8.2 待设置静态IP:192.168.8.25 1.编辑:vi /etc/netplan/01-network-manager-all.yaml 打开以后内容如下: # ...

  2. 面试题:cook和session

    1.首先,Cookie与Session存在的目的是什么? 答:二者都是为了保持客户端访问用户与后台服务器的交互状态,之所以为了保持这种状态,一是为了方便一些业务的实现,另一方面就是为了简化后台服务端的 ...

  3. Ubuntu16.04 ARM 编译 编译器版本和unordered_map map问题

    源文件内使用unordered_map时候,例如如下demo #include <unordered_map> void foo(const std::unordered_map<i ...

  4. Anaconda( different versions) configuration in ubuntu 14

    1. 安装自己经常使用的Anaconda版本 sh ./Anaconda3-5.0.1-Linux-x86_64.sh 2. 默认安装到 /home/usr/anaconda3下面,在anaconda ...

  5. c#并发编程经典实例文摘

    第1章 并发编程概述 1.1 并发编程简介 并发: 多线程(包括并行处理) 异步编程(异步操作)程序启动一个操作,而该操作将会在一段时间后完成 响应时编程(异步事件)可以没有一个实际的开始,可以在任何 ...

  6. 使用dom解析器对xml文档内容进行增删查改

    直接添代码: XML文档名称(one.xml) <?xml version="1.0" encoding="UTF-8" standalone=" ...

  7. MongoDB整理笔记のDump & Restore

       备份 [root@localhost bin]# ./mongodump -d my_mongodb connected to: 127.0.0.1 DATABASE: my_mongodb t ...

  8. vitamio MediaController总是显示在底部的问题

    前面一直用腾讯的x5 tas来播放视频,但是体验效果不好,不能设置播放页,无法获取用户对视频的学习情况,百度了下,发现好多人在使用vitamio,最新版本是5.0的,下载可能要花费点时间,官网上竟然没 ...

  9. C# 常用正则验证[转]

    using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.W ...

  10. 洛谷P2756 飞行员配对方案问题（二分图匹配）

    传送门 一个基础的二分图匹配(虽然今天才学会) 因为不会匈牙利算法只好用网络流做 先新建一个超级源和超级汇,源往所有左边的点连边,所有右边的点往汇连边 然后跑一边最大流就好了 顺便记录一下匹配到谁就好 ...