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
    New Coder
    Join Date
    Jun 2007
    Posts
    61
    Thanks
    13
    Thanked 0 Times in 0 Posts

    a problem with frames

    Hi,

    I want to put an iframe (or a frame) in a page on my website, with the content in the iframe coming from another website. But I want the entire page to reload when (1) anyone clicks on any link in the iframe, and (2) anyone clicks on any button (after submitting a form) in the iframe.

    Then why am I using an iframe? Well, that is a channel on my site being powered by the other site. So the look and feel should be mine, but the block in the iframe comes from them.

    Is there any way to do this?

    I had an idea (actually this idea was in another site, it's not mine) that I could put all my content in frames too (header, right side ad and footer), and write a JavaScript function like this that I would get the other site to put in the HTML of all its content that appears in the iframe:

    function doThree(pageA,pageB,pageC)
    {
    (parent.frame1.location=pageA);
    (parent.frame2.location=pageB);
    (parent.frame3.location=pageC);
    }

    and get every hyperlink on the other site look like this:

    <a href="whatever" onclick="doThree('newpage1.html','newpage2.html','newpage3. html')">ONE LINK changes all frames</a>

    The hassle is, they might crib about having to recode a zillion <a href> tags. So is there any way that this could be done in the CSS of the other site itself, by making every hyperlink (anchor tag) automatically run that onclick function, so that I do not have to worry about the manual effort of re-hardcoding several <a href>s, and the missing out that might happen?

    I would really, really appreciate any pointers - either a solution to what I asked, or a completely different approach altogether .

    Again, I would want the frames belonging to my content (as opposed to the frame containing their content) to reload even when someone clicks on a submit button.

    Thank you for reading this through!

  • #2
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,037
    Thanks
    0
    Thanked 250 Times in 246 Posts
    Is this what you want? This will load your 3 pages every time the iframe with external page is loaded, that is every time the url of that iframe changes.
    Code:
    function loadMyPages(pageA, pageB, pageC){
       window.frames["frame1"].location.href = pageA;
       window.frames["frame2"].location.href = pageB;
       window.frames["frame3"].location.href = pageC;
    }
    Code:
    <iframe src="http://www.othersite.com" onload="loadMyPages('newpage1.html','newpage2.html','newpage3.html')"></iframe>
    
    <iframe name="frame1" src="mypage1.html"></iframe>
    <iframe name="frame2" src="mypage2.html"></iframe>
    <iframe name="frame3" src="mypage3.html"></iframe>

  • #3
    New Coder
    Join Date
    Jun 2007
    Posts
    61
    Thanks
    13
    Thanked 0 Times in 0 Posts

    Thanks!

    Thanks a lot, Glenn! This indeed seems to be it. I will test further and let you know. Thanks again for such a simple solution!

  • #4
    New Coder
    Join Date
    Jun 2007
    Posts
    61
    Thanks
    13
    Thanked 0 Times in 0 Posts

    Problem

    There's a small problem with that piece of code, though. The first time that I load the page, all the iframes (4 of mine, and 1 of the partner channel) load, but the moment the partner channel's iframe finishes loading, it reloads all my iframes. So, all my iframes load twice the first time.

    Here is the URL. I am still testing this, so you might find some borders etc.

    http://www.fullhyderabad.com/htdocs/jobs/home.html

    Do you have any ideas on how to overcome this? Thank you for your time, as always!

  • #5
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,037
    Thanks
    0
    Thanked 250 Times in 246 Posts
    Code:
    var loaded = 1;
    function loadMyPages(pageA, pageB, pageC){
       if (loaded>1){
         window.frames["frame1"].location.href = pageA;
         window.frames["frame2"].location.href = pageB;
         window.frames["frame3"].location.href = pageC;
       }
       loaded++;
    }

  • #6
    New Coder
    Join Date
    Jun 2007
    Posts
    61
    Thanks
    13
    Thanked 0 Times in 0 Posts

    Thanks again!

    Thank you very much, Glenn! That fixes all problems... except one - would you know how I can make the height of the iframe coming from the partner site fit the height of the document (page) in the partner site that has loaded? I tried some stuff in w3 and other JS resources, but nothing seems to work.

    Thanks again for all the help!

  • #7
    Senior Coder rnd me's Avatar
    Join Date
    Jun 2007
    Location
    Urbana
    Posts
    4,292
    Thanks
    10
    Thanked 583 Times in 564 Posts
    since you cannot access the properties of the framed document, you can't really do that.

    it MAY be possible to set your iframe's scrolling to auto, and then do a little trick i learned:

    have a loop to slowly increase the width of the iframe by 5px each time (use a setTimeout). then look at the computed height and width and watch for them to change on thier own since the last loop iteration.

    often, when an iframe puts up it's scrollbars, it gets slightly bigger, and triggers a reflow.



    i should mention an amazing script i came across the other day that might really be what you are looking for:
    from http://www.dynamicdrive.com/.

    the "dhtmlwindow" script lets you drag and drop iframe like window windows. you can resize, minimize, etc. i was really impressed...

  • #8
    New Coder
    Join Date
    Jun 2007
    Posts
    61
    Thanks
    13
    Thanked 0 Times in 0 Posts
    Thanks, rnd_me. Well, that script works only if the page in the iframe is of the same domain as the rest of the page . Mine is from a different domain.

    Would anyone know of any workaround? Once again, this is the URL:

    http://www.fullhyd.com/htdocs/jobs/home.html

    Thank you for your time!

  • #9
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,037
    Thanks
    0
    Thanked 250 Times in 246 Posts
    For security reasons, Javascript cannot access another page in a different domain. If you have an agreement with the external site, you can ask them to add that iframe script in their site.


  •  

    Posting Permissions

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