Question

我想让javascript检测屏幕分辨率本身，因为我可能有不同的LCD，每个都有不同的大小。这是我暂时的代码。

<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>

我试着把javascript放到代码中

<img src = "screenshot.jpeg" <script type="text/JavaScript">"width ="screen.width </script>>

但失败了。当我打开它，我希望它可以得到解决方案本身可以任何人帮我解决这个问题？提前谢谢

Answer 1

您的代码似乎有些问题：

您可以从JavaScript:事件中移除onLoad，这在超链接中使用

<a href="javascript: doSomething()" />Link</a>

此外，您每隔1毫秒尝试刷新一次页面（如果您尝试每秒刷新一次，则应将其更改为1000）。

您的功能会更好地编写，因此您可以避免使用eval：

function timedRefresh(timeoutPeriod) {
    setTimeout(function() { 
        location.reload(true); 
    }, timeoutPeriod);
}

Answer 2

在你的情况下，这就足够了：

<img src = "screenshot.jpeg" width ="100%" />

jsFiddle Demo

当然，如果body与视口大小相同，这只会执行您想要的操作。这基本上告诉浏览器img应该与其父级一样大（在这种情况下为body）。

注意： Javascript无法按预期方式运行。 <script>是一个HTML元素，可让您将脚本（主要是Javascript）嵌入到文档中。您无法在客户端使用Javascript更改HTML源代码（就像您可以在服务器端使用PHP，Python等）。您可以修改DOM。

Answer 3

你可以试试这个

window.screen.availHeight for getting height
window.screen.availWidth  for getting width

感谢。

Answer 4

只有在您不太担心旧版本的IE时，CSS3'大小'和'封面'属性才有助于这种情况。而且无需使用任何JavaScript

演示 - 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%;
}

Answer 5

尝试：

window.screen.availHeight
window.screen.availWidth

如何在javascript中检测屏幕分辨率

5 个答案: