跨浏览器用javascript获取窗口的位置和大小

转载 2015年07月07日 08:52:36

跨浏览器获取位置

<code class="hljs coffeescript has-numbering" style="display: block; padding: 0px; color: inherit; box-sizing: border-box; font-family: 'Source Code Pro', monospace;font-size:undefined; white-space: pre; border-radius: 0px; word-wrap: normal; background: transparent;"><span class="hljs-reserved" style="box-sizing: border-box;">var</span> leftX = <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">typeof</span> <span class="hljs-built_in" style="color: rgb(102, 0, 102); box-sizing: border-box;">window</span>.screenLeft == <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'number'</span> ? <span class="hljs-built_in" style="color: rgb(102, 0, 102); box-sizing: border-box;">window</span>.screenLeft : <span class="hljs-built_in" style="color: rgb(102, 0, 102); box-sizing: border-box;">window</span>.screenX;
<span class="hljs-reserved" style="box-sizing: border-box;">var</span> topY = <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">typeof</span> <span class="hljs-built_in" style="color: rgb(102, 0, 102); box-sizing: border-box;">window</span>.screenTop == <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'number'</span> ? <span class="hljs-built_in" style="color: rgb(102, 0, 102); box-sizing: border-box;">window</span>.screenTop : <span class="hljs-built_in" style="color: rgb(102, 0, 102); box-sizing: border-box;">window</span>.screenY;</code><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right; background-color: rgb(238, 238, 238);"><li style="box-sizing: border-box; padding: 0px 5px;">1</li><li style="box-sizing: border-box; padding: 0px 5px;">2</li></ul>

firefox浏览器不支持screenLeft和scrennTop,但是支持screenX和screenY;ie浏览器支持screenLeft和scrennTop,但是不支持screenX和screenY 
跨浏览器获取大小

<code class="hljs coffeescript has-numbering" style="display: block; padding: 0px; color: inherit; box-sizing: border-box; font-family: 'Source Code Pro', monospace;font-size:undefined; white-space: pre; border-radius: 0px; word-wrap: normal; background: transparent;"><span class="hljs-reserved" style="box-sizing: border-box;">var</span> width = <span class="hljs-built_in" style="color: rgb(102, 0, 102); box-sizing: border-box;">window</span>.innerWidth;      <span class="hljs-regexp" style="color: rgb(0, 136, 0); box-sizing: border-box;">//</span><span class="hljs-built_in" style="color: rgb(102, 0, 102); box-sizing: border-box;">window</span>.必须有,因为IE不支持
<span class="hljs-reserved" style="box-sizing: border-box;">var</span> height = <span class="hljs-built_in" style="color: rgb(102, 0, 102); box-sizing: border-box;">window</span>.innerHeight;        <span class="hljs-regexp" style="color: rgb(0, 136, 0); box-sizing: border-box;">//</span>如果支持inner的,那么就使用它,

<span class="hljs-regexp" style="color: rgb(0, 136, 0); box-sizing: border-box;">//</span>不支持的就是用<span class="hljs-built_in" style="color: rgb(102, 0, 102); box-sizing: border-box;">document</span>对象的方法

<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">if</span> (<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">typeof</span> width != <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'number'</span>) {
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">if</span> (<span class="hljs-built_in" style="color: rgb(102, 0, 102); box-sizing: border-box;">document</span>.compatMode == <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'CSS1Compat'</span>) {
        width = <span class="hljs-built_in" style="color: rgb(102, 0, 102); box-sizing: border-box;">document</span>.documentElement.clientWidth; <span class="hljs-regexp" style="color: rgb(0, 136, 0); box-sizing: border-box;">//</span>标准ie
        height = <span class="hljs-built_in" style="color: rgb(102, 0, 102); box-sizing: border-box;">document</span>.documentElement.clientHeight;
    } <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">else</span> {   <span class="hljs-regexp" style="color: rgb(0, 136, 0); box-sizing: border-box;">//</span>非标准ie
        width = <span class="hljs-built_in" style="color: rgb(102, 0, 102); box-sizing: border-box;">document</span>.body.clientWidth;    
        height = <span class="hljs-built_in" style="color: rgb(102, 0, 102); box-sizing: border-box;">document</span>.body.clientHeight;
    }
}</code>

跨浏览器用javascript获取窗口的位置和大小

跨浏览器获取位置var leftX = typeof window.screenLeft == 'number' ? window.screenLeft : window.screenX; var t...
  • yilanyoumeng3
  • yilanyoumeng3
  • 2015年07月06日 11:19
  • 923

VB记录窗体的大小和位置

在我们写程序的时候,有时需要记录当前窗体位置和大小,以便下次打开时恢复上次的大小跟位置,像一般的播放器 浏览器就有这个功能 通过注册表记录窗体的大小跟位置 Private Su...
  • liushuijinger
  • liushuijinger
  • 2011年08月19日 23:17
  • 3144

MFC窗口位置和大小的获取

最近在做一个项目,需要控件随对话框大小的变化而变化,因此需要准确获取对话框窗口、控件的大小和位置。   经过好一番查寻、测试,终于看到了希望。下面是一些获取窗口位置和大小的函数,示例如下: 1...
  • l198738655
  • l198738655
  • 2017年07月18日 17:14
  • 1063

BOM:窗口位置、页面视口大小、window.open

获取窗口位置: // 兼容所有浏览器的写法 var leftPos = (typeof window.screenLeft === "number") ? window.screenLeft : w...
  • xujiezi
  • xujiezi
  • 2016年04月08日 18:37
  • 1125

窗口位置、大小设置

一:SetWindowPos BOOL SetWindowPos(const CWnd* pWndInsertAfter,int x,int y,int cx,int cy,UINT nFlags);...
  • piaopiaopiaopiaopiao
  • piaopiaopiaopiaopiao
  • 2014年11月25日 22:44
  • 2583

Javascript获取窗口的大小及位置

捣腾了二个多小时,终于找到获取窗口的方法了。现在做一个笔记,这种错误我可不想在犯一次!呵呵....... Javascript获取窗口(容器)的大小及位置一系列的东西比较多,容易混淆,在这里列举及简...
  • dabing69221
  • dabing69221
  • 2013年11月12日 23:35
  • 776

javascript——窗口大小和视口大小

窗口大小和视口大小的问题 IE9+、FireFox、Safari、Opera和Chrome提供了4个属性 innerWidth、outerWidth、innerHeight、outHeight ...
  • u014701862
  • u014701862
  • 2015年04月29日 10:52
  • 1328

Qt 获取窗口的位置和大小

QDesktopWidget 提供了详细的位置信息,其能够自动返回窗口在用户窗口的位置和应用程序窗口的位置, QDesktopWidget* desktopWidget = QApplication...
  • duxingheiying1041
  • duxingheiying1041
  • 2016年04月18日 15:47
  • 3836

JavaScript获取页面大小,滚动条位置,元素位置

//页面位置及窗口大小 function GetPageSize() { var scrW, scrH; if(window.innerHeight && window.scrollMaxY) {...
  • lovegonghui
  • lovegonghui
  • 2015年09月08日 11:25
  • 1136

更改获取到窗口句柄的游戏界面大小、位置

更改其他程序的界面 HWND GameHwnd = NULL; //游戏大厅的窗口句柄 DWORD GameID = NULL;//游戏的进程ID   HANDLE GameHa...
  • nonecode
  • nonecode
  • 2014年05月10日 23:17
  • 2257
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:跨浏览器用javascript获取窗口的位置和大小
举报原因:
原因补充:

(最多只允许输入30个字)