window.screenLeft:window.screenX，window.innerWidth，screen.width，screen.availWidth

最新推荐文章于 2024-04-05 06:16:19 发布

zgjx2019

最新推荐文章于 2024-04-05 06:16:19 发布

阅读量929

点赞数

分类专栏： JS

本文链接：https://blog.csdn.net/zgjxyszh/article/details/79535237

版权

JS 专栏收录该内容

8 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>window.innerWidth  window.screenLeft:window.screenX  </title>
</head>
<body>

<p id="demo"></p>
<p id="demo1"></p>
<p id="demo2"></p>
<p id="demo3"></p>
<p id="demo4"></p>
<script>
//只读整数。声明了窗口的左上角在屏幕上的的 x 坐标和 y 坐标。IE、Safari 和 Opera 支持 screenLeft 和 screenTop，而 Firefox 和 Safari 支持 screenX 和 screenY。
var leftPos=(typeof window.screenLeft=="number")?window.screenLeft:window.screenX;
var topPos=(typeof window.screenTop=="number")?window.screenTop:window.screenY;
//window.screenLeft火狐不支持undefined，火狐得使用window.screenX
//window.screenX ie不支持undefined，ie得使用window.screenLeft



//每个浏览器对这两个数据的解析不一样




document.getElementById("demo").innerHTML=leftPos+"</br>"+topPos+"</br>";
//window.moveTo(100,100);
alert(window.innerWidth);
alert(document.documentElement.clientWidth);
alert(document.body.clientWidth);

// window.innerWidth	与或出来最大值
alert(window.innerWidth|| document.documentElement.clientWidth|| document.body.clientWidth);
var w=window.innerWidth  || document.documentElement.clientWidth  || document.body.clientWidth; 
document.getElementById("demo1").innerHTML ="window.innerWidth|| document.documentElement.clientWidth|| document.body.clientWidth:"+w;
//每个浏览器对这两个数据的解析不一样
alert(window.innerHeight);
alert(document.documentElement.clientHeight);
alert(document.body.clientHeight);

//window.innerHeight 与或出来最大值
alert(window.innerHeight|| document.documentElement.clientHeight|| document.body.clientHeight);
var h=window.innerHeight || document.documentElement.clientHeight  || document.body.clientHeight;     
document.getElementById("demo2").innerHTML = "window.innerHeight|| document.documentElement.clientHeight|| document.body.clientHeight" + h;



//每个浏览器对这两个数据的解析不一样




//Internet Explorer 8,7，6，5：document.documentElement.clientHeight要么document.body.clientHeight浏览器窗口（浏览器窗口）不包括工具栏和滚动条。

//window.screen对象可以在没有窗口的前缀被写入,该window.screen对象包含了用户的屏幕信息.
//screen.width属性返回访问者的像素屏幕的宽度.
//该screen.availWidth属性返回访问者的屏幕的宽度，以像素为单位，减去界面功能，如Windows任务栏上。
document.getElementById("demo4").innerHTML =
"Screen Width: " + screen.width+"</br>"
+"Screen Height: " + screen.height+"</br>"
+"Available Screen Width: " + screen.availWidth+"</br>"
+"Available Screen Height: " + screen.availHeight+ "</br>";



//每个浏览器对这两个数据的解析一样




</script>

</body>
</html>

zgjx2019

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
window.screenLeft:window.screenX，window.innerWidth，screen.width，screen.availWidth

&lt;!DOCTYPE html&gt;&lt;html&gt;&lt;head&gt; &lt;meta charset="utf-8"&gt; &lt;title&gt;window.innerWidth window.screenLeft:window.screenX &lt;/title&gt;&lt;/head&gt;&lt;body&amp
复制链接

扫一扫

专栏目录