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 5 of 5
  1. #1
    Smokes a Lot
    Join Date
    Jul 2003
    Location
    CA, USA
    Posts
    1,594
    Thanks
    5
    Thanked 20 Times in 20 Posts

    Hide an <iframe> on click.

    Seems this is pretty straight forward but I can't get it to work. I just want the iframe to stop displaying on click. Am I missing somthing here?

    <html>
    <head>
    <script language="javascript">
    function hideFrame()
    {
    pane.style.display="none";
    }
    </script>
    </head>
    <body>
    <iframe src="" id="pane"></iframe>
    <input type="button" onclick="hideFrame()">
    </body>
    </html>
    Last edited by Basscyst; 10-19-2003 at 07:56 PM.

  • #2
    Regular Coder
    Join Date
    Jul 2003
    Location
    Massachusetts
    Posts
    472
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Try this:
    Code:
    document.getElementById("pane").style.display="none";
    Moderator @ WebDeveloper.com
    Mentor @ WebXpertz.net

  • #3
    Smokes a Lot
    Join Date
    Jul 2003
    Location
    CA, USA
    Posts
    1,594
    Thanks
    5
    Thanked 20 Times in 20 Posts
    That did the trick. Thanks alot! I was thinking I couldn't use getElementById on an inline frame but now that I think about it, it's the just the document of the iframe that won't work on (if i wanted to document.write to it). It's strange though in my actual code I have 2 frames in this function I am hiding one and replacing the contents of another. I don't need the getElemenbyId for the frame I am replacing the contents of, but for the one I want hidden I do. Why is that? The function looks just like this now.

    function seeBase()
    {
    disp1.location.replace(document.getElementById('dbPath').value);
    document.getElementById('disp2').style.display="none";
    }

  • #4
    Regular Coder
    Join Date
    Jul 2003
    Location
    Massachusetts
    Posts
    472
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Could you please post the rest of the HTML code? It may be because you're referring to it using it's name attribute as opposed to it's id attribute.
    Moderator @ WebDeveloper.com
    Mentor @ WebXpertz.net

  • #5
    Smokes a Lot
    Join Date
    Jul 2003
    Location
    CA, USA
    Posts
    1,594
    Thanks
    5
    Thanked 20 Times in 20 Posts
    Sure thing. Here is the code: Thanks for the help.
    Oh you just want the HTML sorry.

    <--<removed JS>-->

    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 3.2//EN">
    <html>
    <body>
    <center>
    <h2>Overtime Database Utility</h2>
    <form name="shifts">
    DB:<input type="file" id="dbPath">
    CSV:<input type="file" id="otPath" name="it">
    <input type="button" value="Start" onclick="previewChanges()">
    <br>
    <iframe src="" id="disp1" height=400 width=315></iframe>
    <iframe src="" id="disp2" height=400 width=315></iframe>
    <br>
    <input type="button" onclick="makeNew();" value="Update Database">

    <input type="button" onclick="purgeData();" value="Purge Files">
    <input type="button" onclick="seeBase()" value="View Database">
    <input type="button" onclick="window.location.reload()" Value="Finish">
    </form>
    </body>
    </html>
    Last edited by Basscyst; 10-19-2003 at 08:18 PM.


  •  

    Posting Permissions

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