码迷,mamicode.com
首页 > 移动开发 > 详细

移动端获取屏幕宽度

时间:2018-02-24 11:43:40      阅读:215      评论:0      收藏:0      [点我收藏+]

标签:目录   gpo   推荐   width   key   keyword   根据   bsp   html   

  • 移动端获取屏幕宽度

    目录:

    概述:

    今天聊一个开发移动端经常碰到的一个问题:如何获取屏幕宽度,获取屏幕的办法有很多,今天总结一下各个方法的优点、缺点。

    $(window).width():

    用jQuery或者zepto获取屏幕宽度的方法最为简单,但是在Android平台上,有时会获取的不准确(为0),从而影响布局。在IOS平台上还是很稳定。
    1
    var width = $(window).width();

    scrollWidth:

    根据我的经验,scrollWidth获取屏幕宽度还比较准,也比较稳定,但可能会有细微出入。
    1
    var width = document.body.scrollWidth;

    让平台返回屏幕宽度:

    我认为目前为止,最稳定,最准确的方法就是让平台返回屏幕宽度。但是要对返回的宽度稍做处理,因为平台返回的是系统的宽度,需要除以分辨率。
    1
    2
    var dpi = window.devicePixelRatio;//获取屏幕分辨率
    var width = sysWidth / dpi;//用系统返回宽度除以分辨率。
    此方法唯一的缺点就是比较麻烦,需要平台配合,所以以上3种方法各有利弊,大家自己取舍,我还是推荐让平台返回。

移动端获取屏幕宽度

标签:目录   gpo   推荐   width   key   keyword   根据   bsp   html   

原文地址:https://www.cnblogs.com/520BigBear/p/8464574.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!