1

我是这个论坛的新手，实际上我刚刚登录。

我有一个只包含一个标签的索引文件。

这是我的代码

<!DOCTYPE HTML>
<html>
<head>

<link rel="stylesheet" href="css/style.css" type="text/css"/>


<script>

h=screen.availHeight;
w=screen.availWidth;

</script>
</head>
<body>
<div id="container" align="center">
    <img id="image" src="images/last.png" alt="starting"                               onmouseover="this.src='images/first.png';" 
    onmouseout="this.src='images/last.png';"  usemap="#map"/>  

    <map name="map">
        <area shape="rect" coords="13,250,455,450" alt="shops" href="">
        <area shape="rect" coords="675,310,1080,390" alt="eshop" href="/opencart/upload">
    </map>
</div>

我想要做的是根据访问者的屏幕尺寸改变图像的尺寸。我知道availHeight 和availWidth 返回浏览器使用的屏幕的高度和宽度。我想将返回的值保存在变量 h 和 w 中，然后将 html 标记内的这些变量解析为 height=h 和 width=w

你能帮我建立我的功能并完成这项工作吗？

任何帮助将不胜感激。

4

1 回答 1

0

您可以在 javascript 中指定宽度和高度。将您的脚本放在结束正文标记之前或放入document.ready。

h=screen.availHeight;
w=screen.availWidth;
$(document).ready(function(){
  $img = $('#image');
  $img.width(w);
   $img.height(h);
});

或者

h=screen.availHeight;
w=screen.availWidth;
$(document).ready(function(){
  img = document.getElementById('image');
  img.style.width = w;
  img.style.height = h;
});
于 2013-01-28T18:20:39.383 回答