Results 1 to 9 of 9

Thread: Exclude some files from iframe ssi script?

  1. #1
    Join Date
    Feb 2007
    Posts
    36
    Thanks
    4
    Thanked 0 Times in 0 Posts

    Default Exclude some files from iframe ssi script?

    1) Script Title: Iframe SSI Script

    2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...iframessi2.htm

    3) Describe problem:
    I am using the Iframe SSI script on one of my websites. Works great. But there are 2 files (very long lists of URL's) and I would prefer if they were loaded in an iframe with a set height.
    Is there some way to alter the script to do this?
    Also - if it is possible in the first place - when a link within these files is clicked, could the page containing the iframe go back to re-sizing?
    Thank you in advance. Here's the script I'm using (I think it's an older version) I've tried adding an if/else statement (in red), but I leaves everything a blank.
    Code:
    <script type="text/javascript">
    /***********************************************
    * IFrame SSI script II- © Dynamic Drive DHTML code library (http://www.dynamicdrive.com)
    * Visit DynamicDrive.com for hundreds of original DHTML scripts
    * This notice must stay intact for legal use
    ***********************************************/
    var whatsloaded = document.getElementById('mainframe').src;
    if (whatsloaded != "noresize-for-me.htm") 
    {
    var iframeids=["mainframe"]
    
    var iframehide="yes"
    
    function resizeCaller() {
    var dyniframe=new Array()
    for (i=0; i<iframeids.length; i++){
    if (document.getElementById)
    resizeIframe(iframeids[i])
    
    if ((document.all || document.getElementById) && iframehide=="no"){
    var tempobj=document.all? document.all[iframeids[i]] : document.getElementById(iframeids[i])
    tempobj.style.display="block"
    }
    }
    }
    
    function resizeIframe(frameid){
    var currentfr=document.getElementById(frameid)
    if (currentfr && !window.opera){
    currentfr.style.display="block"
    if (currentfr.contentDocument && currentfr.contentDocument.body.offsetHeight) //ns6 syntax
    currentfr.height = currentfr.contentDocument.body.offsetHeight; 
    else if (currentfr.Document && currentfr.Document.body.scrollHeight) //ie5+ syntax
    currentfr.height = currentfr.Document.body.scrollHeight;
    if (currentfr.addEventListener)
    currentfr.addEventListener("load", readjustIframe, false)
    else if (currentfr.attachEvent){
    currentfr.detachEvent("onload", readjustIframe) // Bug fix line
    currentfr.attachEvent("onload", readjustIframe)
    }
    }
    }
    
    function readjustIframe(loadevt) {
    var crossevt=(window.event)? event : loadevt
    var iframeroot=(crossevt.currentTarget)? crossevt.currentTarget : crossevt.srcElement
    if (iframeroot)
    resizeIframe(iframeroot.id);
    }
    
    function loadintoIframe(iframeid, url){
    if (document.getElementById)
    document.getElementById(iframeid).src=url
    }
    
    if (window.addEventListener)
    window.addEventListener("load", resizeCaller, false)
    else if (window.attachEvent)
    window.attachEvent("onload", resizeCaller)
    else
    window.onload=resizeCaller
    }
    </script>
    Last edited by Peter Johnson; 03-02-2008 at 06:17 PM.

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    I would think that to get the src of the iframe and have it mean anything, you would have to actually change it when switching the page in the iframe. This is cumbersome. However, an ordinary link will change the iframe's location href, but this is not a property of the iframe, rather a property of the window.frames object. It can be worked out. I would do something like so, instead of:

    Code:
    var whatsloaded = document.getElementById('mainframe').src;
    if (whatsloaded != "noresize-for-me.htm") 
    {
    I would do something like:

    Code:
    var excludes=['noresize-for-me.htm', 'noresize-for-me-2.htm'];
    
    var testloaded = function(id){
    var fobjs=window.frames, fels=document.getElementsByTagName('iframe');
    for (var i = fels.length-1; i > -1; --i)
    if(fels[i].id==id)
    var h = fobjs[i].location.href.replace(/^.*\/([^\/]*)/, '$1');
    for (var j = excludes.length-1; j > -1; --j)
    if(excludes[j]==h)
    return false;
    return true;
    }
    Then in the portion where the script starts to get to work on resizing any given iframe:

    Code:
    function resizeIframe(frameid){
    if(frameid&&!testloaded(frameid))
    return;
    var currentfr=document.getElementById(frameid)
    if (currentfr && !window.opera){
    currentfr.style.display="block"
    if (currentfr.contentDocument && curre
    Last edited by jscheuer1; 03-02-2008 at 07:50 PM. Reason: fix typo
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  3. The Following User Says Thank You to jscheuer1 For This Useful Post:

    Peter Johnson (03-02-2008)

  4. #3
    Join Date
    Feb 2007
    Posts
    36
    Thanks
    4
    Thanked 0 Times in 0 Posts

    Default

    Thanks John. Ive tried what you suggested. But it still just resizes everything (which is better than my version, which made nothing show up at all, but...) whether it's the page it starts with or a link. Here's what I've got. (I added a height to the iframe in the body, so it would have a default if the resize didn't happen)
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
                "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <script type="text/javascript">
    /***********************************************
    * IFrame SSI script II- © Dynamic Drive DHTML code library (http://www.dynamicdrive.com)
    * Visit DynamicDrive.com for hundreds of original DHTML scripts
    * This notice must stay intact for legal use
    ***********************************************/
    var excludes=['test2.htm', 'test1.htm'];
    
    var testloaded = function(id){
    var fobjs=window.frames, fels=document.getElementsByTagName('iframe');
    for (var i = fels.length-1; i > -1; --i)
    if(fels[i].id==id)
    var h = fobjs[i].location.href.replace(/^.*\\([^\\]*)/, '$1');
    for (var j = excludes.length-1; j > -1; --j)
    if(excludes[j]==h)
    return false;
    return true;
    }
    
    
    var iframeids=["mainframe"]
    
    var iframehide="yes"
    
    function resizeCaller() {
    var dyniframe=new Array()
    for (i=0; i<iframeids.length; i++){
    if (document.getElementById)
    resizeIframe(iframeids[i])
    
    if ((document.all || document.getElementById) && iframehide=="no"){
    var tempobj=document.all? document.all[iframeids[i]] : document.getElementById(iframeids[i])
    tempobj.style.display="block"
    }
    }
    }
    
    function resizeIframe(frameid){
    if(frameid&&!testloaded(frameid))
    return;
    var currentfr=document.getElementById(frameid)
    if (currentfr && !window.opera){
    currentfr.style.display="block"
    if (currentfr.contentDocument && currentfr.contentDocument.body.offsetHeight) //ns6 syntax
    currentfr.height = currentfr.contentDocument.body.offsetHeight; 
    else if (currentfr.Document && currentfr.Document.body.scrollHeight) //ie5+ syntax
    currentfr.height = currentfr.Document.body.scrollHeight;
    if (currentfr.addEventListener)
    currentfr.addEventListener("load", readjustIframe, false)
    else if (currentfr.attachEvent){
    currentfr.detachEvent("onload", readjustIframe) // Bug fix line
    currentfr.attachEvent("onload", readjustIframe)
    }
    }
    }
    
    function readjustIframe(loadevt) {
    var crossevt=(window.event)? event : loadevt
    var iframeroot=(crossevt.currentTarget)? crossevt.currentTarget : crossevt.srcElement
    if (iframeroot)
    resizeIframe(iframeroot.id);
    }
    
    function loadintoIframe(iframeid, url){
    if (document.getElementById)
    document.getElementById(iframeid).src=url
    }
    
    if (window.addEventListener)
    window.addEventListener("load", resizeCaller, false)
    else if (window.attachEvent)
    window.attachEvent("onload", resizeCaller)
    else
    window.onload=resizeCaller
    
    </script>
    
    
    </head>
    <body>
    
    <iframe id="mainframe" src="test1.htm" scrolling="no" width="550" height="200"></iframe>
    
    </body>
    </html>
    Last edited by Peter Johnson; 03-02-2008 at 07:51 PM.

  5. #4
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    I didn't test my code, so either I made a typo or you installed it incorrectly, or . . . there can always be other factors.

    Ah, I see a typo:

    Code:
    location.href.replace(/^.*\\([^\\]*)/, '$1')
    should be:

    Code:
    location.href.replace(/^.*\/([^\/]*)/, '$1')
    One thing that might not have been obvious is, that in the array of excludes, you should only put the filename, no path, as the testloaded function strips the path from the location.href. I'll fix it in the original.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  6. The Following User Says Thank You to jscheuer1 For This Useful Post:

    Peter Johnson (03-02-2008)

  7. #5
    Join Date
    Feb 2007
    Posts
    36
    Thanks
    4
    Thanked 0 Times in 0 Posts

    Default

    WOW - it works now. Thank you so much.
    One more question - it doesn't automatically resize when another page (not in the excluded list) is clicked on. But I notice that if I refresh the page, with the new non-excluded page, it then does re-size. Is there any way to have the page reload just one more time after the new page is clicked?

  8. #6
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    Let's try getting rid of:

    Code:
    if(frameid&&!testloaded(frameid))
    return;
    Then in the readjustIframe function add:

    Code:
    function readjustIframe(loadevt) {
    var crossevt=(window.event)? event : loadevt
    var iframeroot=(crossevt.currentTarget)? crossevt.currentTarget : crossevt.srcElement
    if (iframeroot&&iframeroot.id&&testloaded(iframeroot.id))
    resizeIframe(iframeroot.id);
    }
    If that doesn't get it:

    Please post a link to the page on your site that contains the problematic code so we can check it out.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  9. #7
    Join Date
    Feb 2007
    Posts
    36
    Thanks
    4
    Thanked 0 Times in 0 Posts

    Default

    No - making those last changes just causes everything to re-size.

    The page isn't up, so I created a test site at http://users.abac.com/veronicam/ifra...ize_script.htm

    It starts with a page that shouldn't be resized. When you click the link for "link to test 2" that page SHOULD be resized, but isn't until you refresh the page.

    I also created a page with it in reverse http://users.abac.com/veronicam/ifra...ze_script2.htm The initial page should be resized, then the link to "test 1" should not. Again, the second page works correctly, but only after you refresh the page.

    Although I just noticed another issue - there's no scrollbar, and thus no way to read the content that's not visible ...

    BTW - thank you for spending so much time on this.
    Last edited by Peter Johnson; 03-02-2008 at 09:33 PM.

  10. #8
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    The order in which things were happening was all wrong, and some key data was missing. That's what I get for not testing this, but I was busy with some real work. Using your demo, I came up with (too many changes to highlight):

    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
                "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <script type="text/javascript">
    /***********************************************
    * IFrame SSI script II- © Dynamic Drive DHTML code library (http://www.dynamicdrive.com)
    * Visit DynamicDrive.com for hundreds of original DHTML scripts
    * This notice must stay intact for legal use
    ***********************************************/
    var excludes=[['test1.htm', 200], ['test_whatever.htm', 400]];
    
    var testloaded = function(id){
    var fobjs=window.frames, fels=document.getElementsByTagName('iframe');
    for (var i = fels.length-1; i > -1; --i)
    if(fels[i].id==id)
    break;
    var h = fobjs[i].location.href.replace(/^.*\/([^\/]*)/, '$1');
    for (var j = excludes.length-1; j > -1; --j)
    if(excludes[j][0]==h){
    fels[i].height=excludes[j][1];
    return false;
    }
    return true;
    }
    
    
    var iframeids=["mainframe"]
    
    var iframehide="yes"
    
    function resizeCaller() {
    var dyniframe=new Array()
    for (i=0; i<iframeids.length; i++){
    if (document.getElementById)
    resizeIframe(iframeids[i])
    
    if ((document.all || document.getElementById) && iframehide=="no"){
    var tempobj=document.all? document.all[iframeids[i]] : document.getElementById(iframeids[i])
    tempobj.style.display="block"
    }
    }
    }
    
    function resizeIframe(frameid){
    var currentfr=document.getElementById(frameid)
    if (currentfr && !window.opera){
    if (currentfr.addEventListener)
    currentfr.addEventListener("load", readjustIframe, false)
    else if (currentfr.attachEvent){
    currentfr.detachEvent("onload", readjustIframe) // Bug fix line
    currentfr.attachEvent("onload", readjustIframe)
    }
    if(frameid&&!testloaded(frameid))
    return;
    currentfr.style.display="block"
    if (currentfr.contentDocument && currentfr.contentDocument.body.offsetHeight) //ns6 syntax
    currentfr.height = currentfr.contentDocument.body.offsetHeight; 
    else if (currentfr.Document && currentfr.Document.body.scrollHeight) //ie5+ syntax
    currentfr.height = currentfr.Document.body.scrollHeight;
    }
    }
    
    function readjustIframe(loadevt) {
    var crossevt=(window.event)? event : loadevt
    var iframeroot=(crossevt.currentTarget)? crossevt.currentTarget : crossevt.srcElement
    if (iframeroot)
    resizeIframe(iframeroot.id);
    }
    
    function loadintoIframe(iframeid, url){
    if (document.getElementById)
    document.getElementById(iframeid).src=url
    }
    
    if (window.addEventListener)
    window.addEventListener("load", resizeCaller, false)
    else if (window.attachEvent)
    window.attachEvent("onload", resizeCaller)
    else
    window.onload=resizeCaller
    
    </script>
    
    
    </head>
    <body>
    
    
    <iframe id="mainframe" src="test1.htm" scrolling="auto" width="550" height="200"></iframe>
    
    
    </body>
    </html>
    The major change that needs to be taken into account from your point of view is that the excludes array is now multidimensional, with each entry itself also being an array. The second part of each of these is the default height for the iframe for that excluded page.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  11. The Following User Says Thank You to jscheuer1 For This Useful Post:

    Peter Johnson (03-03-2008)

  12. #9
    Join Date
    Feb 2007
    Posts
    36
    Thanks
    4
    Thanked 0 Times in 0 Posts

    Default

    This is fantastic - I can not thank you enough. Those for whom you are doing your "real work" (especially if it involves coding) are very lucky to have you.
    Thanks again.

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
  •