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. linux c 获取系统时间

    #include <time.h> main() { time_t timep; time (&timep); printf(“%s”,asctime(gmtime(&ti ...

  2. c语言函数是怎么传递参数的

    其实就是把变量或常量复制了一份给函数中的变量,简单说来就是复制的过程. 有一个很经典的问题:用函数交换两个变量的值. int a=1; int b=2; swap(a,b) 有一个函数是这样实现的 v ...

  3. Smarty3——内置函数

    Table of Content {$var} {$append} {assign} {block} {call} {config_load} {debug} {extends} {for} {for ...

  4. 实现一个简单的Plugin

    1.准备 1)安装pluginlib_tutorials包: 2)创建一个包 2.创建基类 创建一个基类,所有的插件都将从基类继承,如RegularPolygon基类 创建一个基类头文件 其内容如下 ...

  5. rest 参数和扩展运算符

    rest 参数和扩展运算符 rest 参数的形式为 ...变量名:扩展运算符是三个点 .... rest 参数 function add(...values) { console.log(values ...

  6. Charles安装证书ssl proxying

    1.找到工具栏上方的 help 按钮 2.help下面有一个 ssl proxying的选项,点击ssl proxying 选择里面的第三个:install charles root certific ...

  7. php二维数组修改键名

    最近遇到一个问题,是关于json数据提交的时候,总是报出[object object]的错误,查了晚上需要资料,大部分的说法是json数据格式不规范导致的错误.一般建议说将dataType类型注释掉. ...

  8. MVC下的cshtml和aspx页面

    MVC中的aspx页面是System.Web.Mvc.ViewPage类的实例. 表示将视图呈现为 Web 窗体页所需的属性和方法. 继承层次结构 System.Object System.Web.U ...

  9. java多线程的基本介绍

    Java多线程 1.进程与线程 进程是程序的一次动态执行过程,它需要经历从代码加载,代码执行到执行完毕的一个完整的过程,这个过程也是进程本身从产生,发展到最终消亡的过程.多进程操作系统能同时达运行多个 ...

  10. Tomcat调优总结

    Tomcat 优化分为系统优化,Java虚拟机调优,Tomcat本身的优化. Tomcat 如何起停 ./catalina.sh stop ./catalina.sh start/sbin/servi ...