vue解决给PC端页面设置最小宽度 移动端受到影响问题
1
·
在PC端页面开发中经常需要处理由于页面过度缩小导致字体都挤在一起的问题,可以通过给页面设置最小宽度来解决这个问题
但是当需要对一个项目进行网页PC端和移动端两个页面的开发时,移动端也会受到最小宽度的影响,所以,首先要判断当前打开页面的设备是PC端还是移动端
function isDeviceMobile() {//判断函数 返回值true为移动端 false为PC端
var u = navigator.userAgent
var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1 //android终端
var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/) //ios终端
if (isiOS || isAndroid) {
return true
} else {
return false
}
}
返回true则是移动端,返回false则是PC端
<div
id="app"
:style="[{ minWidth: !isDeviceMobile() ? '1200px' : 0 }]" //如果是PC端则设置最小宽度
>
</div>
更多推荐
已为社区贡献4条内容
所有评论(0)