找回密码
 立即注册

QQ登录

只需一步,快速开始

查看: 571|回复: 0
打印 上一主题 下一主题

获得网页窗口实际大小的javascript代码实例

[复制链接]

2617

主题

2617

帖子

7789

积分

论坛元老

Rank: 8Rank: 8

积分
7789
跳转到指定楼层
楼主
发表于 2018-2-18 04:48:25 | 只看该作者 回帖奖励 |倒序浏览 |阅读模式

                      在做web2.0风格的弹出窗口的时候,经常需要把背景变暗和屏蔽。这时就需要得到一个网页的宽高数据。这里就会有很多细节和兼容性问题。经过长期摸索,现提供以下函数,希望对大家有用。这个函数的具体作用是获得网页的高度和宽度,如果网页没有窗口可见区域高的时候则取窗口的可见区域高度和宽度。返回值为一个对象 ,例如 { width:123, height:345}。现在兼容几乎所有的浏览器。
    java script代码:
function get_page_size()
{
    var re = {};
    if (document.documentElement && document.documentElement.clientHeight)
    {
        var doc = document.documentElement;
        re.width = (doc.clientWidth>doc.scrollWidth)?doc.clientWidth-1:doc.scrollWidth;
        re.height = (doc.clientHeight>doc.scrollHeight)?doc.clientHeight:doc.scrollHeight;
    }
    else
    {
        var doc = document.body;
        re.width = (window.innerWidth>doc.scrollWidth)?window.innerWidth:doc.scrollWidth;
        re.height = (window.innerHeight>doc.scrollHeight)?window.innerHeight:doc.scrollHeight;
    }
    return re;
}
[color=]904 viewed 3 comment(s)

    代码实例:




获取窗口大小




  浏览器窗口 的 实际高度:
  
  

  浏览器窗口 的 实际宽度:
  
  





分享到:  QQ好友和群QQ好友和群 QQ空间QQ空间 腾讯微博腾讯微博 腾讯朋友腾讯朋友
收藏收藏
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

用户反馈
客户端