Window screenX 与 screenY 属性

实例

返回新窗口相对于屏幕的 x 和 y 坐标:

<!DOCTYPE html>
<html>
<head>
<script>
function myFunction() {
  var myWindow = window.open("", "myWin");
  myWindow.document.write("<p>This is 'myWin'");
  myWindow.document.write("<br>ScreenX: " + myWindow.screenX);
  myWindow.document.write("<br>ScreenY: " + myWindow.screenY + "</p>");
}
</script>
</head>
<body>
<button onclick="myFunction()">打开 "myWin"</button>
</body>
</html>

运行一下

定义与用法

screenX 和 screenY 属性返回窗口相对于屏幕的 x（水平）和 y（垂直）坐标。

浏览器支持

表中的数字指定完全支持该特性的第一个浏览器版本。

属性
screenX	Yes	9.0	Yes	Yes	Yes
screenY	Yes	9.0	Yes	Yes	Yes

提示：对于 IE8 和更早版本，您可以使用 "window.screenLeft" 和 "window.screenTop" 代替。

语法

window.screenXwindow.screenY

技术细节

返回值:	一个数字，表示窗口相对于屏幕的水平和/或垂直距离，以像素为单位

更多实例

实例

以指定的左上位置打开一个新窗口，并返回其坐标:

<!DOCTYPE html>
<html>
<head>
<script>
function myFunction() {
  var myWindow = window.open("", "myWin", "left=700, top=350, width=200, height=100");
  myWindow.document.write("<p>This is 'myWin'");
  myWindow.document.write("<br>ScreenX: " + myWindow.screenX);
  myWindow.document.write("<br>ScreenY: " + myWindow.screenY + "</p>");
}
</script>
</head>
<body>
<button onclick="myFunction()">打开 "myWin"</button>
</body>
</html>

运行一下

实例

跨浏览器解决方案（对于IE8及更早版本，使用 screenLeft 和 screenTop ）:

<!DOCTYPE html>
<html>
<head>
<script>
function myFunction() {
  var myWindow = window.open("", "myWin", "left=700, top=350, width=200, height=100");
  var winLeft = myWindow.screenLeft ? myWindow.screenLeft : myWindow.screenX;
  var winTop = myWindow.screenTop ? myWindow.screenTop : myWindow.screenY;
  myWindow.document.write("<p>This is 'myWin'");
  myWindow.document.write("<br>Horizontal: " + winLeft);
  myWindow.document.write("<br>Vertical: " + winTop + "</p>");
}
</script>
</head>
<body>
<p>单击按钮创建一个新窗口，并获取新窗口相对于屏幕的水平和垂直坐标。</p>
<button onclick="myFunction()">打开 "myWin"</button>
<p id="demo">
</body>
</html>

运行一下

Window screenX 与 screenY 属性

实例

定义与用法

浏览器支持

语法

技术细节

更多实例

实例

实例

分类导航