SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Guru quenting's Avatar
    Join Date
    Dec 2002
    Location
    Switzerland
    Posts
    735
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Accessing an iframe content through DOM

    ok this is a bit technical:
    I have a page which contains an iframe (id="iframeid").
    I am trying to interact with its contents from the parent page.
    Let's say i want to change the display property for the first link in the iframe.

    I tried this:
    Code:
    (...)
    <iframe id="iframeid" src="thesrc.html"></iframe>
    <script type="text/javascript">
    <!--
    myifr = document.getElementsById('iframeid');
    col = myifr.getElementsByTagName('LINK');
    var alink = col[0];
    alink.style.display='none';
    -->
    </script>
    But it does not work. The link can still be seen, and i don't know why.
    Could it be because the iframe is loaded separately and is not yet loaded when the script runs ? Should i use some kind of onload thing then ? How to check if an iframe content is loaded ?
    Any other idea why this would not work ?

    Thanks a lot for any help
    Quentin
    The largest message boards on the web !
    unblog.fr, hosting 700000 french blogs

  2. #2
    I'll take mine raw silver trophy MikeFoster's Avatar
    Join Date
    Dec 2002
    Location
    Alabama, USA
    Posts
    2,560
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi Quentin, sorry for the late reply.

    I wrote this demo for a different purpose - but I added a little to it for this.

    1) I added the f1Onload handler in the frameset file
    2) I added a link in the frame1 file with an id=='hideMe'

    Part of the frameset file:
    Code:
    <html>
    <head>
    <script type='text/javascript'>
    function f1Onload() {
      var f1 = window.frames['frame1'];
      var ele = f1.document.getElementById('hideMe');
      ele.style.display = 'none';
    }
    </script>
    </head>
    <frameset id='frameset1' rows="50%,50%" cols="50%,50%">
    <frame name="frame1" src="frame1_resize.html" onload='f1Onload()'>
    <frame name="frame2" src="frame2_resize.html">
    <frame name="frame3" src="frame3_resize.html">
    <frame name="frame4" src="frame4_resize.html">
    </frameset>
    </html>
    Part of the frame1 src file:
    Code:
    <html>
    <head>
    <title>Frame Resize Demo</title>
    <link rel='stylesheet' type='text/css' href='frame_resize.css'>
    </head>
    <body>
    
    <p><a id='hideMe' href='http://cross-browser.com/'>Cross-Browser.com</a></p>
    
    <p><a href='http://cross-browser.com/'>Cross-Browser.com</a></p>
    
    </body>
    </html>
    I tested it (quickly) on Win98 with Mozilla 1.4, Firebird 0.6.1, and IE 6.0. Did not work with Opera 7.11.

  3. #3
    SitePoint Guru quenting's Avatar
    Join Date
    Dec 2002
    Location
    Switzerland
    Posts
    735
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    very nice thanks a lot. didn't know you could set an onload on a frame (that makes sens however). I guess this was why mine didn't work.

    Thanks !
    Quentin
    Last edited by quenting; Oct 10, 2003 at 05:42.
    The largest message boards on the web !
    unblog.fr, hosting 700000 french blogs

  4. #4
    Sultan of Ping jofa's Avatar
    Join Date
    Mar 2002
    Location
    SvÝ■jˇ­
    Posts
    4,080
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hmm, does that thing work for an iframe with external src too?

  5. #5
    I'll take mine raw silver trophy MikeFoster's Avatar
    Join Date
    Dec 2002
    Location
    Alabama, USA
    Posts
    2,560
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quentin, you're very welcome.

    jofa, yes - In frame3 I added a frameset with two rows. A thin frame on top has the toolbar with the min/res buttons, and the bottom frame loads a page from a different domain.

    This thing has all kinds of possibilities. Even tho I don't care for framed sites - this has been fun to play with


Bookmarks

Posting Permissions

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