1

私はこのフォーラムに初めて参加しました。実際にサインインしたばかりです。

タグを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で幅と高さを割り当てることができます。bodyタグを終了する直前にスクリプトを配置するか、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 に答える