当前位置: 首页 > 面试题库 >

以跨浏览器的方式查找视口的确切高度和宽度(无原型/ jQuery)

竺勇
2023-03-14
问题内容

我正在尝试找到浏览器视口的确切高度和宽度,但是我怀疑Mozilla或IE给我的号码不正确。这是我的身高方法

var viewportHeight = window.innerHeight || 
                     document.documentElement.clientHeight || 
                     document.body.clientHeight;

我还没有开始做宽度,但是我猜它将会是类似的东西。

有没有更正确的方式来获取此信息?理想情况下,我希望该解决方案也能与Safari / Chrome /其他浏览器一起使用。


问题答案:

您可以尝试以下方法:

function getViewport() {

 var viewPortWidth;
 var viewPortHeight;

 // the more standards compliant browsers (mozilla/netscape/opera/IE7) use window.innerWidth and window.innerHeight
 if (typeof window.innerWidth != 'undefined') {
   viewPortWidth = window.innerWidth,
   viewPortHeight = window.innerHeight
 }

// IE6 in standards compliant mode (i.e. with a valid doctype as the first line in the document)
 else if (typeof document.documentElement != 'undefined'
 && typeof document.documentElement.clientWidth !=
 'undefined' && document.documentElement.clientWidth != 0) {
    viewPortWidth = document.documentElement.clientWidth,
    viewPortHeight = document.documentElement.clientHeight
 }

 // older versions of IE
 else {
   viewPortWidth = document.getElementsByTagName('body')[0].clientWidth,
   viewPortHeight = document.getElementsByTagName('body')[0].clientHeight
 }
 return [viewPortWidth, viewPortHeight];
}

但是,甚至不可能在所有浏览器中都获得视口信息(例如,古怪模式下的IE6)。但是上面的脚本应该做得很好:-)



 类似资料:
  • 我是JavaFX的新手,我正在编写一个简单的登录应用程序,我想在我的web浏览器中启动它。 我如何获得web浏览器的宽度和高度?是否有一些对象用于此目的,或一个方法,我希望能够调整应用程序的大小,每当浏览器的大小改变。

  • 我们问这个问题,因为这个2013年的线程(100-宽度-背景-图像-自动高度)的答案似乎不再起作用了。 我需要一个响应的背景图像与100%的宽度和自动高度。 我想根据屏幕大小使用媒体查询而不是Javascript提供不同的图像。 如果它在不同的浏览器上工作就好了(至少Chrome/火狐) 使用以下代码: 图像显示正确,100%宽度和自动高度(参见此处:JSFIDDLE1),但在更改屏幕大小时,我无

  • 文件:main。派克 文件:run_me.py 我试图从左下角到右上角画一条线。 我认为这可能是一个尺度问题(变量self.available\u width,self.available\u height)。 我做错了什么?

  • 我见过很多关于如何分别设置ImageView和GridView的高度和宽度的问题。这里,这里,还有这里 但是,我想知道如何设置两者。 这是我的设置。在我的GridView中,我有一个ImageView和一个TextView。我有一些不同宽度和大小的图像,我想调整它们的大小,使其始终是屏幕正方形大小的1/3。下面,我有一段文字描述。 这是我到目前为止的代码。。。 gallerygridview.xm

  • 问题内容: 我试图找到屏幕的宽度和高度,但是我尝试过的任何方法都无法在我创建的类中使用,下面是我的代码。 有人知道如何找到它吗?我无法使用下面尝试的方式,因为.getWidth()已弃用? 问题答案: 使用以下代码

  • 问题内容: 如何通过ImageView编程设置的宽度和高度? 问题答案: 设置ImageView的高度可能为时已晚,但是为了其他有相同问题的人: 希望这可以帮助。 重要。如果要在布局已经“布局”之后设置高度,请确保还调用: