Results 1 to 6 of 6

Thread: resizing iframe from iframe content

  1. #1

    Join Date
    Feb 2008
    Location
    Colombia
    Posts
    127
    Rep Power
    10

    resizing iframe from iframe content

    hi, i want to display some contents, and below each content is an iframe; initially the iframe shows a summary of the content rating, but once i click on the iframe, it should expand to display the ratings in more detail. this 'detail list' is arbitray in lenght, so i want that when the user clicks on it, it will resize to fit the entire list, how do i resize an iframe from the page displayed inside it? (i want to resize the lenght, not the width, which must remain the same)

    tnx

  2. #2
    Rick
    Join Date
    May 2002
    Location
    Minneapolis, MN
    Posts
    1,752
    Rep Power
    18
    I believe it may be technically possible to dynamically resize an <iframe> with JavaScript if the content being displayed is all coming from the same domain. But it's an area where I don't have enough experience to give you particulars and I don't have time just now to experiment to find out. I just know enough to expect that if it is possible, it might not be simple or elegant.

    My first instinct is that you will need to check that the document has fully loaded, which might be very difficult to determine. But if all goes well, then do some calculations based on the result of getComputedStyle on the style.height of the <iframe> document's <body> tag. Much of this will probably best be done with JavaScript embedded in the <iframe>d document, and then you'll pass the result back to the JavaScript in the parent document that will update the <iframe>.style.height.

    If you run into roadblocks with the <iframe> method, my advice would be to load the dynamic content into a <div> with AJAX. I think this will be much easier, with far less potential for JavaScript security issues, and provide better results. Although here, too, it will be much easier if you have total control over the dynamic content. Good luck!
    Rick Trethewey

  3. #3

    Join Date
    Feb 2008
    Location
    Colombia
    Posts
    127
    Rep Power
    10
    hmm.. i can not have the content preloaded, since the ratings are in one table, and the content in other, i would have to make a request for each list of ratings (which means number of requests = 1+number of contents, for the ratings of each one), which is what i am trying to avoid, so that's why i made the ratings only available on demand, as a separate request. you may be right about ajax, but i don't know ajax yet which means i have to start from zero for this particular thing, and that was another thing i was trying to avoid.. well, the sooner the better

  4. #4

    Join Date
    Feb 2008
    Location
    Colombia
    Posts
    127
    Rep Power
    10
    just checked the ajax thing.. that wasn't so hard (luckily). tnx

  5. #5

    Join Date
    Feb 2008
    Location
    Colombia
    Posts
    127
    Rep Power
    10
    hi, this is not a 'how do i'.. but instead a 'why does this happen'

    i was checking the ajax thing, i plan to set there the summary of the ratings for that content, and when the user clicks on the summary, it will load and display the ratings in all detail. inside the div, as a first conent, i place a table with an 'onclick' event (related to the table inside the div, not the div itself, so when the table is gone after being replaced, the event handle is gone as well). as a test i was trying to load not dynamic content, but one of my pages with static content. i was clicking and changing and doing stuff but the page did not load inside the div.. i was expecting the page to load inside the div like it was an iframe, never happened. so i changed that for a simple php, which would display whatever it was that i passed as parameters to it, and it worked. i believe the difference is not because one ended in html and the other in php, or that i was using 'post' method. i can post or get to an html whatever i want, the only difference is that the html will do nothing with it. why did it not load the html inside the div? is it because of the html headers? i was expecting the div to act like an iframe for that case, and i spend quite a while believing i was doing the ajax thing wrong.. what are the requisites for a content to appear inside a div after an ajax call?

    tnx

  6. #6
    Rick
    Join Date
    May 2002
    Location
    Minneapolis, MN
    Posts
    1,752
    Rep Power
    18
    No, a <div> will not behave like an <iframe> and the HTML <head> data is why. The <div> is a part of the existing page, with its own stylesheet and other settings. So while you can insert an entire HTML page into a <div> with JavaScript, you end up with a malformed HTML page that browsers will not render reliably. That's why you need to use an <iframe> for this purpose. <iframe>s are intended to accept complete HTML documents and render them independent of the settings in the parent HTML document.
    Rick Trethewey

Posting Permissions

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