下雨咯
下雨咯
  • 发布:2017-12-20 09:48
  • 更新:2017-12-20 12:18
  • 阅读:1248

底部选项卡横屏适配问题

分类:MUI

请问这怎么解决

2017-12-20 09:48 负责人:无 分享
已邀请:
下雨咯

下雨咯 (作者) - 谢绝私聊

@DCloud_MUI_FXY @DCloud_heavensoft

n***@gmail.com

n***@gmail.com

// 监听设备是否横竖屏  
window.addEventListener('resize', function(e) {  
	var orientation = window.orientation,  
	       width = window.innerWidth;  
		if(orientation == 0 || orientation == 180) {  
			//竖屏  
			leftPos = Math.ceil((window.innerWidth - 60) / 2);  
			drawNativeIcon.setStyle({  
				bottom: '5px',  
				left: leftPos + 'px',  
				width: '60px',  
				height: '60px'  
			});  
  
		} else if(orientation == 90 || orientation == -90) {  
			// 横屏  
			leftPos = Math.ceil((window.innerWidth - 60) / 2);  
			drawNativeIcon.setStyle({  
				bottom: '5px',  
				left: leftPos + 'px',  
				width: '60px',  
				height: '60px'  
			});  
		}  
});
  • n***@gmail.com

    已经升级了 明天就会更新


    2017-12-20 14:53

  • 下雨咯 (作者)

    回复 n***@gmail.com:大佬,这个监听很有效,虽然M图标的坐标没有问题了,但是tabbar和页面不对应,甚至第二个tabbar不能点击。 另外我试了你更新在GitHub上的代码,效果依然如我所说,我觉得大佬你可能只把重点放在M上了 没有去试着点一下其他的tabbar。期待回复。


    2017-12-21 16:49

3***@qq.com

3***@qq.com

mui tap横屏不是一样自适配的吗,如果你要适配高度,不要用px单位,bottom: $(".mui-bar-tab").height(); 我底部的高度都是用rem单位去写的,这样就适配了

  • 下雨咯 (作者)

    看图就明白啦


    2017-12-20 15:09

该问题目前已经被锁定, 无法添加新回复