移动端适配iphoneX、iPhone XS、iPhone XS Max、iPhone XR方法

本文介绍了在使用mui框架开发中遇到的底部tab栏在iPhone X、iPhone XS、iPhone XS Max、iPhone XR上显示被遮挡的问题,并提供了通过获取屏幕大小调整初始化参数的解决方案。
摘要由CSDN通过智能技术生成

使用mui框架的底部tab栏打包后在iphoneX、iPhone XS、iPhone XS Max、iPhone XR上展示出现问题,底部会被遮挡大半。

效果如下图:

解决方案:获取屏幕大小来写不同的初始化参数

下面是代码:

if (/iphone/gi.test(navigator.userAgent) && (screen.height == 896 && screen.width == 414)) {
		// iPhone XS Max   iPhone XR
		mui.init({
		swipeBack: false, //启用右滑关闭功能,
		keyEventBind: {
			backbutton: false //关闭back按键监听
		},
		subpages: [ //首先加载首页  
			{
				url: 'page/chat/chat.html',
				id: 'chat',
				styles: {
				    top: '0px',
				    bottom: '95px'
			    }
			}
		],
		preloadPages: [ //预加载其他页面  
			{
				url: 'page/location/location.html',
				id: 'location',
				styles: {
					top: '0px',
					bottom: '95px'
				}
			},
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值