zoukankan      html  css  js  c++  java
  • JS关于浏览器尺寸的方法

    document.body.clientWidth BODY对象宽度。通配符未清零margin的时候,小于页面可见区域宽度
    document.body.clientHeight BODY对象高度。
    document.documentElement.clientWidth 可见区域宽度
    document.documentElement.clientHeight 可见区域高度
    document.body.scrollWidth 网页正文全文宽
    document.body.scrollHeight 网页正文全文高
    document.body.scrollTop 网页被卷去的高//未用过
    document.body.scrollLeft 网页被卷去的左//未用过
    window.screenTop 网页正文部分上//未用过
    window.screenLeft 网页正文部分左//未用过
    window.screen.width 屏幕分辨率的宽
    window.screen.height 屏幕分辨率的高
    window.screen.availWidth 屏幕可用工作区宽度
    window.screen.availHeight 屏幕可用工作区高度(含浏览器框架的高度)

     e.g.

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset='utf-8' />
    <meta name="viewport" content="initial-scale=1.0; maximum-scale=1.0; maximum-scale=1.0;" />
    <style>
    *{ margin:0; padding:0; line-height:20px; 1000px; height:1000px;}
    </style>
    </head>
    <body>
    1
    <script>
    window.onload = function(){document.write('BODY对象宽度'+document.body.clientWidth+'<br />'+
    	'BODY对象高度'+document.body.clientHeight+'<br />'+
    	'可见区域宽度'+document.documentElement.clientWidth+'<br />'+
    	'可见区域高度'+document.documentElement.clientHeight+'<br />'+
    	'网页正文全文宽'+document.body.scrollWidth+'<br />'+
    	'网页正文全文高'+document.body.scrollHeight+'<br />'+
    	'网页被卷去的高'+document.body.scrollTop+'<br />'+
    	'网页被卷去的左'+document.body.scrollLeft+'<br />'+
    	'网页正文部分上'+window.screenTop+'<br />'+
    	'网页正文部分左'+window.screenLeft+'<br />'+
    	'屏幕分辨率的宽'+window.screen.height+'<br />'+
    	'屏幕分辨率的高'+window.screen.width+'<br />'+
    	'屏幕可用工作区宽度'+window.screen.availWidth+'<br />'+
    	'屏幕可用工作区高度'+window.screen.availHeight
    	)}
    </script>
    </body>
    </html>
    

    pc chrome

    BODY对象宽度1000
    BODY对象高度1000
    可见区域宽度1425
    可见区域高度392
    网页正文全文宽1425
    网页正文全文高1000
    网页被卷去的高0
    网页被卷去的左0
    网页正文部分上0
    网页正文部分左0
    屏幕分辨率的宽900
    屏幕分辨率的高1440
    屏幕可用工作区宽度1440
    屏幕可用工作区高度860

    ios chrome

    BODY对象宽度1000
    BODY对象高度1000
    可见区域宽度320
    可见区域高度416
    网页正文全文宽1000
    网页正文全文高1000
    网页被卷去的高0
    网页被卷去的左0
    网页正文部分上0
    网页正文部分左0
    屏幕分辨率的宽480
    屏幕分辨率的高320
    屏幕可用工作区宽度320
    屏幕可用工作区高度460 

  • 相关阅读:
    uiatuomator如何调试
    uiatuomator提示shortMsg=java.lang.RuntimeException
    uiatuomator命令启动apk,与查找多个相同控件
    uiautomator日志文件转换为xml格式文件
    uiautomator做自动化的过程
    uiautomator的坑和AAPT命令方式启动一个应用程序
    ADB无线连接
    用fiddler工具做接口测试
    简单的monkey使用
    疯狂学习java web2(css)
  • 原文地址:https://www.cnblogs.com/archrjoe/p/3615419.html
Copyright © 2011-2022 走看看