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. 33.HAVING 子句

    HAVING 子句 在 SQL 中增加 HAVING 子句原因是,WHERE 关键字无法与合计函数一起使用. SQL HAVING 语法 SELECT column_name, aggregate_f ...

  2. 第一次C语言作业:博客随笔

    1)你觉得大学和高中有什么差别?具体学习上哪? 大学自主学习较多,锻炼自己独立的品质.在学习上,增加了课程的深度和难度,由更多的活动. 2)我希望大学的师生关系是?阅读上述博客后对师生关系有何感想? ...

  3. Model View Controller (MVC) Overview

    By Rakesh Chavda on Jul 01, 2015 What is MVC?Model View Controller is a type of user interface archi ...

  4. (转)使用Jquery+EasyUI 进行框架项目开发案例讲解之一 员工管理源码分享

    原文地址:http://www.cnblogs.com/huyong/p/3334848.html 在开始讲解之前,我们先来看一下什么是Jquery EasyUI?jQuery EasyUI是一组基于 ...

  5. 编写高质量代码改善C#程序的157个建议——建议8: 避免给枚举类型的元素提供显式的值

    建议8: 避免给枚举类型的元素提供显式的值 一般情况下,没有必要给枚举类型的元素提供显式的值.创建枚举的理由之一,就是为了代替使用实际的数值.不正确地为枚举类型的元素设定显式的值,会带来意想不到的错误 ...

  6. poj2002 Squares(hash+折半枚举)

    Description A square is a 4-sided polygon whose sides have equal length and adjacent sides form 90-d ...

  7. Spring注解:Enable相关注解

    @EnableXXX:可以用于取代xml配置中的一些配置,被该注解所标注的类,其中被@Bean标注的方法,一般就用于返回和EnableXXX的XXX相关的Bean,Bean中一般有XXX相关的注解 同 ...

  8. C# return、continue、break

    return 终止当前进程 可用循环判断,验证,等功能 if (ew == v) { PublicControlLib.Class.PublicProperties.ShowSuccess(); re ...

  9. asp.net mvc 请求处理流程,记录一下。

    asp.net mvc 请求处理流程,记录一下.

  10. 如何从Spring官网下载Spring的jar包

    Spring官网:https://spring.io/ 进入官网点击PRODECTS 然后点击Spring Framework 进入下面的页面点击小猫图标: 之后再下面的页面持续向下滚动,找到下图我标 ...