如何利用DOM获取当前页面的width和height?

最近在利用 JQuery学习AJAX,第一个目标就是初步实现网络上流行的“ 仿Windows关机效果”, 说白了就是当WEB程序弹出针对用户的信息提示框时只将供用户选择和阅读的内容高亮显示,而其它部分则被半透明的颜色所遮盖。实现这个效果的原理很简单: 构建一个足够大的遮盖层将屏幕完全覆盖,然后再构建一个位于最上方的层来显示所需的内容。实现的方法有很多,这里我只描述如何获取整个页面(包含出现纵向 滚动条的时候)的宽度和高度,因为只有知道它们,我们才能构建那个足够大的遮盖层。

首先,我们需要借助 document.documentElement来获取当前页面DOW结构的根元素,也就是html元素,所有的内容都包含在html下,只有这样,才能确保我们获得的是当前页面实际的width和height ,而其它的元素如body等则不行。

接下来的事情则容易多了,我们可以借助 element.scrollHeightelement.scrollWidth来轻松的获得document.documentElement的width和height了。 
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值