如何在javascript中检测屏幕分辨率
[英]how to detect screen resolution in javascript
问题描述
i want let the javascript to detect the screen resolution itself because i might have different LCD and each of them are in different size. 
我想让javascript来检测屏幕分辨率本身，因为我可能有不同的LCD，每个都有不同的大小。 this is the code temporary i have. 这是我暂时的代码。
<html>
<head>
<title>ViewImage</title>
<script type="text/JavaScript">
<!--
function timedRefresh(timeoutPeriod) {
setTimeout("location.reload(true);",timeoutPeriod);
}
// -->
</script>
</head>
<body onload="JavaScript:timedRefresh(1);">
<img src = "screenshot.jpeg" width="1014" height="751">
</body>
</html>
i have try to put the javascript into the code 我试着把javascript放到代码中
<img src = "screenshot.jpeg" <script type="text/JavaScript">"width ="screen.width </script>>
but it failed. 但它失败了。 when i open that, i wish it can get the resolution itself at the can anyone help me with this problem ? 当我打开它，我希望它可以得到解决方案本身可以任何人帮我解决这个问题？ thanks in advance 提前致谢
5 个解决方案
解决方案1
3 2012-05-17 10:22:03
You seem to have a few problems with your code: 您的代码似乎有些问题：
You can remove JavaScript: from your onLoad event, this is used within hyperlinks 您可以从onLoad事件中删除JavaScript:这在超链接中使用
<a href="javascript: doSomething()" />Link</a>
Also you are trying to refresh the page every 1 millisecond (if you are trying to refresh every second you should change it to 1000). 此外，您尝试每1毫秒刷新一次页面（如果您尝试每秒刷新一次，则应将其更改为1000）。
Your function would be better written like this so you avoid using eval : 您的函数会更好地编写，因此您可以避免使用eval ：
function timedRefresh(timeoutPeriod) {
setTimeout(function() {
location.reload(true);
}, timeoutPeriod);
}
解决方案2
2 已采纳 2012-05-17 10:12:41
In your case, this would suffice: 在你的情况下，这就足够了：
<img src = "screenshot.jpeg" width ="100%" />
Of course this will only do what you want if body is the same size as the viewport. 当然，如果body与viewport的大小相同，那么这只会做你想要的。 This basically tells the browser that the img should be just as big as its parent (in this case the body ). 这基本上告诉浏览器img应该和它的父级一样大（在这种情况下是body ）。
Note: Javascript does not work the way you expect it. 注意： Javascript无法按预期方式工作。 <script> is an HTML element, that lets you embed scripts (Javascript mostly) into your document. <script>是一个HTML元素，允许您将脚本（主要是Javascript）嵌入到文档中。 You cannot change the HTML source with Javascript on the client side (like you can with PHP, Python, etc. on the server side). 您无法在客户端使用Javascript更改HTML源代码（就像您可以在服务器端使用PHP，Python等）。 You can modify the DOM though. 您可以修改DOM。
解决方案3
1 2012-05-17 10:15:34
You can try this 你可以试试这个
window.screen.availHeight for getting height
window.screen.availWidth for getting width
Thanks. 谢谢。
解决方案4
1 2012-05-17 11:21:30
The CSS3 'size' and 'cover' properties also help in this situation only if you are not much worried about older versions of IE. 只有当您不太担心旧版本的IE时，CSS3“大小”和“封面”属性才有助于这种情况。 And no need to use any JavaScript 而且无需使用任何JavaScript
Demo - http://jsfiddle.net/fHwu8/ 演示 - http://jsfiddle.net/fHwu8/
body{
background: #000 url(http://www.psdgraphics.com/wp-content/uploads/2009/02/abstract-background.jpg) left top fixed no-repeat;
background-size: 100% 100%;
-moz-background-size: 100% 100%; /*cover*/
-webkit-background-size: 100% 100%;
-o-background-size: 100% 100%;
}
解决方案5
0 2012-05-17 10:15:05
try: 尝试：
window.screen.availHeight
window.screen.availWidth
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.