0

私はhtml、css、javascriptの初心者です。そして、ページをサブメニュー項目としてページにロードしようとしています。私はこのコードを持っています:

<!DOCTYPE html>
<html>
    <meta name="viewport" content="width=1024">
    <head>
        <link rel="stylesheet" type="text/css" href="homePage.css">
        <title> Sample Website </title>
        <script>
            function showPicture(value)
            {
                if(value == "true")
                {
                    document.getElementById("content").innerHTML = '';
                    document.getElementById("content").innerHTML 
                            += '<iframe id="Picturebox" width = "76%" height = "545" src="menu1.html"></iframe>';
                }
                else
                {
                document.getElementById("content").innerHTML = '';
                }
            }
        </script>
    </head>
    <body>

        <div id = "Header">
            <h1> SAMPLE WEBSITE </h1>

        </div>      
        <div id = "Banner">
            <img id ="imgBanner" src = "./images/images.jpeg" />
        </div>      
        <div id="container">
        <div id = "menu">
            <table cellpadding="15">
                <tr> 
                    <td>
                        <a href="#" onclick="showPicture('true')">Menu 1</a> 

                    </td> 
                </tr>
                <tr> 
                    <td>
                        <a href="#" onclick="showPicture('false')">Menu 2</a>
                    </td> 
                </tr>
                <tr> 
                    <td>
                        <a href="#"  onclick="showPicture('false')">Menu 3</a>
                    </td> 
                </tr>
                <tr> 
                    <td>
                        <a href="#" onclick="showPicture('false')">Menu 4</a>
                    </td> 
                </tr>
            </table>
        </div> 
        <div id="content"></div>
        </div>


    </body>
</html>

menu1.html

<html>
    <meta name="viewport" content="width=80%,height=80%, scale=0.5">
<head>
    <link rel="stylesheet" type="text/css" href="subPage.css">
</head>
<body>

<h1>Menu 1 </h1>
<div id = "UnderLine"></div>
<p>     Hello!,
        this is a sample page having a heading,some content and 6 pictures .
</p>
<div id = "UnderLine"></div><br/>
<h4> Images </h4>
<div id = "UnderLine"></div><br/>
<div class="imgbox" style="position:relative;">
<img id = "pictures" src="./images/p (1).jpg" name=""/>
<img id = "pictures" src="./images/p (2).jpg" name=""/>
<img id = "pictures" src="./images/p (3).jpg" name=""/>
<img id = "pictures" src="./images/p (4).jpg" name=""/>
<img id = "pictures" src="./images/p (5).jpg" name=""/>
<img id = "pictures" src="./images/p (6).jpg" name=""/>
</div>

</body>

</html>

ここで私は最大限の努力をしました。ただし、IFrame水平スクロールバーを使用してページを読み込みます。中に収まるように助けが必要です。同じものを入手する方法はありますか?私はグーグルで検索しましたが、それらの一部またはすべてが幅について言っています。高さではありません。

4

2 に答える 2

1

試す

<iframe id="Picturebox" width = "76%" height = "545" src="menu1.html" scrolling="no"></iframe>
于 2013-03-27T11:27:28.197 に答える
0
<iframe scrolling="no" ....

このドキュメントを読んでください:http ://www.w3schools.com/tags/att_iframe_scrolling.asp

于 2013-03-27T11:27:01.520 に答える