javascript - 为什么在手机上通过window.screen.width和window.screen.height取到的值是手机分辨率的一半?
天蓬老师
天蓬老师 2017-04-10 16:54:10
0
1
577

我用iphone6,在微信浏览器里面做单页应用,取网页上的基本数据,如window.screen.height取到568,为分辨率高的一半(1136/2)。同理宽度也是,要怎样做才能显示到640x1136的高清分辨率呢?

在手机端取到的

网页可见区域宽 document.body.clientWidth:320
网页可见区域高 document.body.clientHeight:1210
网页可见区域宽 document.body.offsetWidth:320 (包括边线的宽)
网页可见区域高 document.body.offsetHeight:1210 (包括边线的宽)
网页正文全文宽 document.body.scrollWidth:320
网页正文全文高 document.body.scrollHeight:1210
网页被卷去的高 document.body.scrollTop:133
网页被卷去的左 document.body.scrollLeft:0
网页正文部分上 window.screenTop:0
网页正文部分左 window.screenLeft:0
屏幕分辨率的高 window.screen.height:568
屏幕分辨率的宽 window.screen.width:320
屏幕可用工作区高度 window.screen.availHeight:548
屏幕可用工作区宽度 window.screen.availWidth:320

在pc端取这些数据都是正常的,

网页可见区域宽 document.body.clientWidth:568
网页可见区域高 document.body.clientHeight:1210
网页可见区域宽 document.body.offsetWidth:568 (包括边线的宽)
网页可见区域高 document.body.offsetHeight:1210 (包括边线的宽)
网页正文全文宽 document.body.scrollWidth:568
网页正文全文高 document.body.scrollHeight:1210
网页被卷去的高 document.body.scrollTop:0
网页被卷去的左 document.body.scrollLeft:0
网页正文部分上 window.screenTop:157
网页正文部分左 window.screenLeft:60
屏幕分辨率的高 window.screen.height:900
屏幕分辨率的宽 window.screen.width:1440
屏幕可用工作区高度 window.screen.availHeight:877
屏幕可用工作区宽度 window.screen.availWidth:1401
天蓬老师
天蓬老师

欢迎选择我的课程,让我们一起见证您的进步~~

membalas semua(1)
黄舟

首先这不科学啊,640*1136不应该是iPhone5/5s的屏幕像素么?
这个问题首先建议题主先了解一下“屏幕像素”、“屏幕分辨率”、“屏幕像素比devicePixelRatio”、“viewport”等这些概念。
首先在浏览器中能取到的宽高都是以px为单位,由于iPhone是视网膜屏幕,因此一个px中包含2个像素点,所以iPhone在浏览器中取到的px宽高都是手机标示的值的1/2或1/3(6 plus)

Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan
Tentang kita Penafian Sitemap
Laman web PHP Cina:Latihan PHP dalam talian kebajikan awam,Bantu pelajar PHP berkembang dengan cepat!