首页 » MUI » 解决mui 顶部选项卡左右滑动min-height高度实现全屏

解决mui 顶部选项卡左右滑动min-height高度实现全屏

2019.07.04更新:

这个文章是很久以前的了,之前使用mui-fullscreen方法确实可以让选项卡全屏,但是也有一些弊端。我们先说下为啥他一开始会有一个高度,其实这个是因为里面有一个滑动组件的缘故,而滑动组件必须要有一个指定的父高度才可以滚动。这就是为啥官方案例有设置一个高度的原因啦。

处理方式:直接把滑动组件删除(注意在删除的时候底部有 /div 也有删除哦)

解决mui 顶部选项卡左右滑动min-height高度实现全屏

效果图:

解决mui 顶部选项卡左右滑动min-height高度实现全屏

 

 

在写选择卡的代码的时候,我们在使用官网的源码时总会有碰到min-height高度问题

解决mui 顶部选项卡左右滑动min-height高度实现全屏

失败x1
官网中min-height只有215px,枫瑞博客删除color代码,在修改min-heigh的高度,那么高度是增加了,在手机中演示的效果就不是很好了,因为滑动的区域高度只有那么多。

失败x2
min-height设置成100%高度呢,试了没有效果

失败x3
删除区域滑动事件,直接使用div呢,这个算是达到了效果但是在滑动的时候会覆盖顶部的选项卡

解决mui 顶部选项卡左右滑动min-height高度实现全屏

智障成功法x9999

==我都无法计算我在写这篇文章的时候是多么的智障
为什么不直接调用,mui-fullscreen呢?
只需要在下方位置中添加mui-fullscreen 就可以决解顶部选项卡左右滑动min-height全屏,滑动覆盖选项卡问题

解决mui 顶部选项卡左右滑动min-height高度实现全屏

标签:

转载请声明原站来源:作者:枫瑞博客, 转载或复制请以 超链接形式 并注明出处 枫瑞博客网
原文地址:《解决mui 顶部选项卡左右滑动min-height高度实现全屏》 发布于2018-06-19

赞(3) 生成海报

长按图片转发给朋友

微信公测版本发布啦
写bug咯!!写bug!!!多端微信小程序星宿适配中....