zoukankan      html  css  js  c++  java
  • 原生js获取pc和移动端屏幕宽、高的方法

    pc端: 

      var w = window.innerWidth
      || document.documentElement.clientWidth
      || document.body.clientWidth;
      var h = window.innerHeight
      || document.documentElement.clientHeight
      || document.body.clientHeight;

    移动端:  

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


    例:

    <script type="text/javascript">
      var w = window.innerWidth
      || document.documentElement.clientWidth //获取pc的宽,一般在pc上调试的时候用
      || document.body.clientWidth;
      var h = window.innerHeight
      || document.documentElement.clientHeight  //获取pc的高
      || document.body.clientHeight;

      var w1 = window.screen.width  //获取手机屏幕的宽 ,在实际上线的时候使用

      window.onload = function(){
        if(w < 415){
          window.location.assign('tf/index.html');
        }else{
          window.location.assign('sh/index.html');
        }

        if(w1 < 415){
          window.location.assign('tf/index.html');
        }else{
          window.location.assign('sh/index.html');
        }

      }

    </script>



















  • 相关阅读:
    解决docker-compose: command not found
    idea 包存在提示不存在
    使用haproxy负载均衡
    docker使用阿里云仓库上传与下拉images
    docker使用官方仓库上传与下拉images
    WeaveScope-容器监控
    matlab打开
    硬盘测试
    matlab quiver()画箭头的函数
    SDK 和 API 的区别是什么?
  • 原文地址:https://www.cnblogs.com/hermit-gyqy/p/10695250.html
Copyright © 2011-2022 走看看