admin管理员组

文章数量:1312662

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

<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

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

<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

Share Improve this question edited May 17, 2012 at 10:29 kapa 78.8k21 gold badges165 silver badges178 bronze badges asked May 17, 2012 at 10:11 EricEric 3994 gold badges13 silver badges21 bronze badges 2
  • possible duplicate of How to detect the screen resolution with JavaScript? – zerkms Commented May 17, 2012 at 10:12
  • @zerkms I think it is not a duplicate. The screen resolution is not what the OP needs for this purpose. – kapa Commented May 17, 2012 at 10:22
Add a ment  | 

5 Answers 5

Reset to default 3

You seem to have a few problems with your code:

You can remove JavaScript: from your onLoad event, this is used within hyperlinks

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

Your function would be better written like this so you avoid using eval:

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

In your case, this would suffice:

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

jsFiddle Demo

Of course this will only do what you want if body is the same size as the viewport. This basically tells the browser that the img should be just as big as its parent (in this case the body).


Note: Javascript does not work the way you expect it. <script> is an HTML element, that lets you embed scripts (Javascript mostly) into your document. You cannot change the HTML source with Javascript on the client side (like you can with PHP, Python, etc. on the server side). You can modify the DOM though.

You can try this

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

Thanks.

The CSS3 'size' and 'cover' properties also help in this situation only if you are not much worried about older versions of IE. And no need to use any JavaScript

Demo - http://jsfiddle/fHwu8/

body{
    background: #000 url(http://www.psdgraphics./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%;
}

try:

window.screen.availHeight
window.screen.availWidth

本文标签: htmlhow to detect screen resolution in javascriptStack Overflow