【建议】uniapp建议设置最大宽度

分类：uni-app

uniapp

现在在pc打开uniapp的\h5，因为屏幕太大了，体验不好

2 赞关注分享

17 个评论

要回复文章请先登录或注册

zhanghao

代码重写贴下，排版出问题了
···
var timer_id = 0;

if(typeof window !='undefined')
if (window.innerWidth>750){
window.innerWidth=750;
timer_id = setInterval(function(){
//适配尺寸
var el = document.querySelector('html');
var n = Number(el.style.fontSize.replace('px',''));
if(n>30){
el.style.fontSize='30px';
clearInterval(timer_id);
}

console.log(el.style.fontSize);
},100);
}

···

2020-07-18 17:44

zhanghao

又想到个办法，有点小bug，只能改h5的。可以去研究下，在app.vue内<script>下第一行，贴上下面代码
·
var timer_id = 0;

if(typeof window !='undefined')
if (window.innerWidth>750){
window.innerWidth=750;
timer_id = setInterval(function(){
//适配尺寸
var el = document.querySelector('html');
var n = Number(el.style.fontSize.replace('px',''));
if(n>30){
el.style.fontSize='30px';
clearInterval(timer_id);
}

console.log(el.style.fontSize);
},100);
}
·

2020-07-18 17:43

zhanghao

点发行打包后，建个新的html静态页面，body里面就放一个iframe元素，指向index.html 然后给他设置下样式。如下面的代码，就可以实现电脑最大宽度750px了。
·
<html>
<head>
<title></title>
<style>
iframe{
display:block;
width:100%;
max-width:750px;
margin:0 auto;
border:none;
height:100%;
}
</style>
</head>
<body>
<iframe src="index.html" scrolling="no"></iframe>
</body>
</html>
·

2020-07-18 16:10