views:

307

answers:

2

Hi,

I have attached the sample code which demonstrates the problem. I am checking this in Firefox 3.5.7. The problem is the parent HTML has a scrollbar, and it loads an iframe which is fullscreen (height: 100%, width: 100%), I want the parent scrollbar to be removed after the iframe is loaded.

1) Is this possible to do? 2) When we give height: 100%; width: 100% why does it occupy only the view area? But not the full parent occupied area?

This is Main.html
        <Html>
    <head>
        <script type="text/javascript" src="client.js"></script>
        <title>
            I am a client
        </title>    
    </head>
    <body bgcolor="#000000">
        You can see the iframe below...
        You can see the iframe below...
        You can see the iframe below...<br><br>
        <br><br><br><br><br><br>
        <br><br><br><br><br><br>
        <br><br><br><br><br><br>
        <br><br><br><br><br><br>
        <br><br><br><br><br><br><br>
        <br><br><br><br><br><br>
        You can see the iframe below...
        <br>

        <iframe name="clientframe" id = "clientframe" src = "app.html" style="position:absolute;top:0px;left:0px;width:100%;height:100%;z-index:999;background:#ff0000" 
        onload = "sendparams();" frameborder="no">
        </iframe>    
    </body>
    </html>

This is app.html:
<HTML>
<HEAD>
    <title> 
        I am an Application
    </title>
</HEAD>
<BODY>
    <h3>This is an application</h3>
    <br>
    You name <input type="textbox"> <br>
    Password <input type="password"><br>
    <br>
    <br>
    <input type="button" value ="Let me in">
</BODY>

</HTML>

NOTE: Open the Main.html, it will load the app.html in a iframe. You can notice that after iframe is loaded a scroll bar appears, and the red background for the iframe does not completely fill the entire parent.

A: 

The scrollbars will not hide because your IFrame's height if fixed but the text "You can see the iframe below..." last one crosses the height.

If you remove few (atleast two rows of) <br> then it will work fine as per your requirement.

Ravia
I have intentionally put those BR's so that a scrollbar appears on the parent HTML. When we say height: 100%, is there anyway we can make 100% relative to parent HTML?
Manohar
+1  A: 

Hide the Parent window scroll bar when iframe is loaded

put this script at top of the Main.html

<script type="text/javascript">
 function sendparams() {
 document.body.style.overflow = "hidden";
 }
</script>
RSK