Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 9 of 9
  1. #1
    Regular Coder
    Join Date
    Jun 2002
    Location
    TEXAS . . . 'nuf said
    Posts
    468
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question Iframe 100% Height ???????

    Has anyone done and/or seen a 100% HEIGHT IFRAME? I'm looking to get an IFRAME to fill in all the way to the bottom of the viewable browser window. I don't want it to go all the way to the bottom of the page content. I just want it to adjust to what the user sees. This way, they wouldn't use the standard browser scrollbar. Am I making sense? It would have to adjust to the user's resolution, etc. -- just like most other things that adjust when using %'s. But, I have been unsuccessful in getting it to work. Any help? Links and/or code are greatly appreciated.
    Gordo
    "In the End, we will remember not the words of our enemies, but the silence of our friends."
    - Martin Luther King Jr. (1929-1968)

  • #2
    Senior Coder
    Join Date
    Jun 2002
    Location
    Nashua, NH
    Posts
    1,724
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Post the code you have now.
    Are you using tables or css for the page layout? If latter you may need the help of js to make things work in IE.
    You are welcome to preview the site I'm working on now (for my newly created business) that is intended to surpass anything you've seen so far in the "fluidity" category (provided you are using the right tools ): www.klproductions.com/TemplateT4.html
    Help yourself with anything you might find there.
    Last edited by Vladdy; 11-22-2002 at 05:18 AM.
    Vladdy | KL
    "Working web site is not the one that looks the same on common graphical browsers running on desktop computers, but the one that adequately delivers information regardless of device accessing it"

  • #3
    Regular Coder
    Join Date
    Jun 2002
    Location
    TEXAS . . . 'nuf said
    Posts
    468
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I'll have to take a look at your site tomorrow...got to get some rest before work tomorrow.

    I can't say I know everything that I'm trying to do. I can't remember why I have the <!-- --> portions below. It may be old code that I forgot to remove.

    I currently have the IFRAME set at "360", but would like it "100%". No, simply substituting the numbers doesn't work.

    The table below (with IFRAME) is also set inside another table.

    Code:
                <table border="0" cellpadding="4" cellspacing="0" width="100%">
                  <tr>
                    <td valign="top" nowrap>
                      <p>some content here</p>
                    </td>
                    <td valign="top" width="100%">
                      <img src="../images/1x1.gif" width="1" height="10" border="0"><br>
    <!--            <ilayer><layer name="content" top="88" left="600" clip.bottom="400" clip.right="350" width="350" height="400" style="visibility:hidden" src="blank_page.html"></layer></ilayer> -->
    <!--            <ilayer><layer name="content" width="350" height="400" style="visibility:hidden" src="blank_page.html"></layer></ilayer> -->
                      <nolayer>
                      <iframe name="content" id="content" style="position:relative; width:100%; height:360" src="blank_page.html" scrolling="auto" frameborder="0"></iframe>
                      </nolayer>
                    </td>
                  </tr>
                </table>
    Gordo
    "In the End, we will remember not the words of our enemies, but the silence of our friends."
    - Martin Luther King Jr. (1929-1968)

  • #4
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,075
    Thanks
    0
    Thanked 256 Times in 252 Posts
    if you set the height of the iframe to 100%, it will occupy 100% of the containing block, the TD in your case.
    since you have only 1 row, putting height="100%" either of the 2 TDs or the <table> itself will cause the iframe's height to occupy the available window height.

    btw, the <ilayer> tag is for NS4 which doesn't support <iframe> tag.
    Glenn
    ____________________________________

    My Blog
    Tower of Hanoi Android app (FREE!)
    Tower of Hanoi Leaderboard
    Samegame Facebook App
    vBulletin Plugins
    ____________________________________

  • #5
    Regular Coder
    Join Date
    Jun 2002
    Location
    TEXAS . . . 'nuf said
    Posts
    468
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Hmmm....

    Okay, I added a few 100%'s here and there in the table. This helped. I actaully ended up putting 83% for the main table.

    http://www.helindonovan.com/services..._planning.html

    I'm primarily (almost 100% -- sorry for the pun) dealing with Internet Explorer (version 5+). The Netscapes are just not a concern at this point.

    Here's the deal, I'm trying to get the iframe to maximize its height within the web page -- no matter what resolution, etc. But, I don't want the default scrollbar to appear on the right side of the browser window if at all possible. I know it'll show up on some <=800px resolutions (based on changing browser configurations), and that's okay. As for myself, I'm usign 1024px, and the iframe only extends to the bottom of the links to the left of the iframe. I want the iframe to go to just a few pixels shy of the bottom of the browser window. I thought about adding in a 1x1.gif transparent image and making it really tall, but that would activate the default scrollbar. Not having control over what resolutions and browser configs my users are using, I can't determine a set height for such a transparent image, etc.

    And the cloud background image on the left no longer extends to the very bottom because I removed a 100% height designation because it produced the default scrollbar. But, I've been asked to replace this bg image anyway. So I'll find a work-around for that. I'm not worried about it. I did not initially design this site. I've just been asked to manage and maintain it. I've cleaned a few things up, but am still trying to get this iframe issue solved.

    Your time, patience, attention, etc. are all appreciated!
    Gordo
    "In the End, we will remember not the words of our enemies, but the silence of our friends."
    - Martin Luther King Jr. (1929-1968)

  • #6
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,075
    Thanks
    0
    Thanked 256 Times in 252 Posts
    you have nested tables. try putting border=1 to all the tables for easy debugging. And put height="100%" for all the TDs. Then let's see from there.
    Glenn
    ____________________________________

    My Blog
    Tower of Hanoi Android app (FREE!)
    Tower of Hanoi Leaderboard
    Samegame Facebook App
    vBulletin Plugins
    ____________________________________

  • #7
    Regular Coder
    Join Date
    Jun 2002
    Location
    TEXAS . . . 'nuf said
    Posts
    468
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Okay...I've added border="1" to all of the tables in the main content area. I also added it to the iframe.

    NEW PAGE!
    http://www.helindonovan.com/services..._planning.html

    The very first table has a wide image in it. I had to do this because the page was messing up in various resolutions without it. The iframe wouldn't behave. So, it works well with this table/image (I think).
    Gordo
    "In the End, we will remember not the words of our enemies, but the silence of our friends."
    - Martin Luther King Jr. (1929-1968)

  • #8
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,075
    Thanks
    0
    Thanked 256 Times in 252 Posts
    add height="100%" in the table in one of these lines:

    <!--webbot bot="Include" endspan i-checksum="43750" -->
    </td>
    <td valign="top" width="100%">
    <table border="1" cellpadding="0" cellspacing="0" width="100%">
    <tr><td><img border="0" src="../images/1x1.gif" width="660" height="1"></td></tr>
    </table>
    <table border="1" cellpadding="0" cellspacing="4" width="100%" height="100%">
    <tr>
    <!-- BEGIN PAGE CONTENT -->
    Glenn
    ____________________________________

    My Blog
    Tower of Hanoi Android app (FREE!)
    Tower of Hanoi Leaderboard
    Samegame Facebook App
    vBulletin Plugins
    ____________________________________

  • #9
    Regular Coder
    Join Date
    Jun 2002
    Location
    TEXAS . . . 'nuf said
    Posts
    468
    Thanks
    0
    Thanked 0 Times in 0 Posts
    First off...THANK YOU very much for taking the time to look into this with me!

    I tried many combinations of adding the height=100%, but none worked. Somehow (and I'm not too surprised), I overlooked the one you provided. Anyway......it's working great!

    I'm off to tackle the next issue.
    Gordo
    "In the End, we will remember not the words of our enemies, but the silence of our friends."
    - Martin Luther King Jr. (1929-1968)


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •