网站首页  汉语字词  英语词汇  考试资料  写作素材  旧版资料

请输入您要查询的考试资料:

 

标题 jQuery 获取屏幕高度、宽度的简单实现案例
内容
    下面小编就为大家带来一篇jQuery 获取屏幕高度、宽度的简单实现案例。小编觉得挺不错的,现在分享给大家,也给大家做个参考。
    做手机Web开发做浏览器兼容用到了,所以在网上找了些汇总下。
    alert($(window).height()); //浏览器当前窗口可视区域高度 
    alert($(document).height()); //浏览器当前窗口文档的高度 
    alert($(document.body).height());//浏览器当前窗口文档body的高度 
    alert($(document.body).outerHeight(true));//浏览器当前窗口文档body的总高度 包括border padding margin 
    alert($(window).width()); //浏览器当前窗口可视区域宽度 
    alert($(document).width());//浏览器当前窗口文档对象宽度 
    alert($(document.body).width());//浏览器当前窗口文档body的高度 
    alert($(document.body).outerWidth(true));//浏览器当前窗口文档body的总宽度 包括border padding margin 
    // 获取页面的高度、宽度
    function getPageSize() {
      var xScroll, yScroll;
      if (window.innerHeight && window.scrollMaxY) {
        xScroll = window.innerWidth + window.scrollMaxX;
        yScroll = window.innerHeight + window.scrollMaxY;
      } else {
        if (document.body.scrollHeight > document.body.offsetHeight) { // all but Explorer Mac  
          xScroll = document.body.scrollWidth;
          yScroll = document.body.scrollHeight;
        } else { // Explorer Mac...would also work in Explorer 6 Strict, Mozilla and Safari  
          xScroll = document.body.offsetWidth;
          yScroll = document.body.offsetHeight;
        }
      }
      var windowWidth, windowHeight;
      if (self.innerHeight) { // all except Explorer  
        if (document.documentElement.clientWidth) {
          windowWidth = document.documentElement.clientWidth;
        } else {
          windowWidth = self.innerWidth;
        }
        windowHeight = self.innerHeight;
      } else {
        if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode  
          windowWidth = document.documentElement.clientWidth;
          windowHeight = document.documentElement.clientHeight;
        } else {
          if (document.body) { // other Explorers  
            windowWidth = document.body.clientWidth;
            windowHeight = document.body.clientHeight;
          }
        }
      }    
      // for small pages with total height less then height of the viewport  
      if (yScroll < windowHeight) {
        pageHeight = windowHeight;
      } else {
        pageHeight = yScroll;
      }  
      // for small pages with total width less then width of the viewport  
      if (xScroll < windowWidth) {
        pageWidth = xScroll;
      } else {
        pageWidth = windowWidth;
      }
      arrayPageSize = new Array(pageWidth, pageHeight, windowWidth, windowHeight);
      return arrayPageSize;
    }
    // 滚动条
    document.body.scrollTop;
    $(document).scrollTop();
    以上这篇jQuery 获取屏幕高度、宽度的简单实现案例就是小编分享给大家的全部内容了,希望能给大家一个参考
随便看

 

在线学习网考试资料包含高考、自考、专升本考试、人事考试、公务员考试、大学生村官考试、特岗教师招聘考试、事业单位招聘考试、企业人才招聘、银行招聘、教师招聘、农村信用社招聘、各类资格证书考试等各类考试资料。

 

Copyright © 2002-2024 cuapp.net All Rights Reserved
更新时间:2025/5/15 8:34:40