Note that there are some explanatory texts on larger screens.

plurals
  1. POFitting a page into IFRAME
    primarykey
    data
    text
    <p>I am a newbie in html,css,javascript. And I am trying to load a page as a submenu item in my page. I have this code :</p> <pre><code>&lt;!DOCTYPE html&gt; &lt;html&gt; &lt;meta name="viewport" content="width=1024"&gt; &lt;head&gt; &lt;link rel="stylesheet" type="text/css" href="homePage.css"&gt; &lt;title&gt; Sample Website &lt;/title&gt; &lt;script&gt; function showPicture(value) { if(value == "true") { document.getElementById("content").innerHTML = ''; document.getElementById("content").innerHTML += '&lt;iframe id="Picturebox" width = "76%" height = "545" src="menu1.html"&gt;&lt;/iframe&gt;'; } else { document.getElementById("content").innerHTML = ''; } } &lt;/script&gt; &lt;/head&gt; &lt;body&gt; &lt;div id = "Header"&gt; &lt;h1&gt; SAMPLE WEBSITE &lt;/h1&gt; &lt;/div&gt; &lt;div id = "Banner"&gt; &lt;img id ="imgBanner" src = "./images/images.jpeg" /&gt; &lt;/div&gt; &lt;div id="container"&gt; &lt;div id = "menu"&gt; &lt;table cellpadding="15"&gt; &lt;tr&gt; &lt;td&gt; &lt;a href="#" onclick="showPicture('true')"&gt;Menu 1&lt;/a&gt; &lt;/td&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td&gt; &lt;a href="#" onclick="showPicture('false')"&gt;Menu 2&lt;/a&gt; &lt;/td&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td&gt; &lt;a href="#" onclick="showPicture('false')"&gt;Menu 3&lt;/a&gt; &lt;/td&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td&gt; &lt;a href="#" onclick="showPicture('false')"&gt;Menu 4&lt;/a&gt; &lt;/td&gt; &lt;/tr&gt; &lt;/table&gt; &lt;/div&gt; &lt;div id="content"&gt;&lt;/div&gt; &lt;/div&gt; &lt;/body&gt; &lt;/html&gt; </code></pre> <h2>menu1.html</h2> <pre><code>&lt;html&gt; &lt;meta name="viewport" content="width=80%,height=80%, scale=0.5"&gt; &lt;head&gt; &lt;link rel="stylesheet" type="text/css" href="subPage.css"&gt; &lt;/head&gt; &lt;body&gt; &lt;h1&gt;Menu 1 &lt;/h1&gt; &lt;div id = "UnderLine"&gt;&lt;/div&gt; &lt;p&gt; Hello!, this is a sample page having a heading,some content and 6 pictures . &lt;/p&gt; &lt;div id = "UnderLine"&gt;&lt;/div&gt;&lt;br/&gt; &lt;h4&gt; Images &lt;/h4&gt; &lt;div id = "UnderLine"&gt;&lt;/div&gt;&lt;br/&gt; &lt;div class="imgbox" style="position:relative;"&gt; &lt;img id = "pictures" src="./images/p (1).jpg" name=""/&gt; &lt;img id = "pictures" src="./images/p (2).jpg" name=""/&gt; &lt;img id = "pictures" src="./images/p (3).jpg" name=""/&gt; &lt;img id = "pictures" src="./images/p (4).jpg" name=""/&gt; &lt;img id = "pictures" src="./images/p (5).jpg" name=""/&gt; &lt;img id = "pictures" src="./images/p (6).jpg" name=""/&gt; &lt;/div&gt; &lt;/body&gt; &lt;/html&gt; </code></pre> <p>here I tried maximum of my effort . But the <code>IFrame</code> loads the page with a horizontal scroll bar. I need help to <strong>make it fit inside</strong>. Is there any way to obtain the same. I googled but some or all of them saying about width. Not about height. </p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload