Results 1 to 4 of 4

Thread: iFrame SSI II script issue - page up and page down

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

    Default iFrame SSI II script issue - page up and page down

    1) Script Title:
    iFrame SSI II

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

    3) Describe problem:

    The problem is that we have some very long pages - and often users will want to use the page up and page down to be able to scroll through the site.

    Unfortunately page up and down are not working within pages that are resized - same in IE and FF.

    Please see:

    http://selwyndistrict.marketeer.biz/page.pasp?pageid=2 - click on one of the sub categories (so page goes beyond one screen height) and you will see what I mean.

    Any help would be greatly appreciated

    Thanks

    James

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,412
    Thanks
    78
    Thanked 3,432 Times in 3,393 Posts
    Blog Entries
    12

    Default

    That's because the focus is on the iframe which has no scrollbars and therefore cannot be scrolled. Try:

    Code:
    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+FFextraHeight; 
    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)
    }
    }
    
    var loadingDiv;
    loadingDiv = document.getElementById("loading");
    if (loadingDiv != null)
    loadingDiv.innerHTML="";
    self.focus()
    }
    Worked in FF and IE when pasted into the address bar as javascript:void(self.focus()). But once you focus inside the iframe again - say, by clicking within it with the mouse, the focus will again be off of the top page and the pg buttons won't work again. But most people scroll with the mouse though, especially once they've started clicking on things. So, this may be good enough.
    Last edited by jscheuer1; 08-07-2007 at 03:13 AM. Reason: Tweak Solution
    - John
    ________________________

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

  3. #3
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,412
    Thanks
    78
    Thanked 3,432 Times in 3,393 Posts
    Blog Entries
    12

    Default

    I played around with this a bit more and found that an event could be assigned to the page in the iframe that would transfer the pg keys to the parent page. It requires that the iframe be assigned a name that is the same as its id, example:

    Code:
    <iframe name="directory" id="directory" style="BORDER-TOP-WIDTH: 0px; BORDER-LEF . . .
    Here are the modifications:

    Code:
    function resizeIframe(frameid){
    var currentfr=document.getElementById(frameid)
    var fpg=function(e){
    var e=e || window.frames[frameid].event;
    if(e.keyCode==34||e.keyCode==33)
    parent.focus();
    };
    if (currentfr && !window.opera){
    currentfr.style.display="block"
    if (currentfr.contentDocument && currentfr.contentDocument.body.offsetHeight){ //ns6 syntax
    currentfr.height = currentfr.contentDocument.body.offsetHeight+FFextraHeight;
    currentfr.contentDocument.onkeydown=fpg;
    }
    else if (currentfr.Document && currentfr.Document.body.scrollHeight){ //ie5+ syntax
    currentfr.height = currentfr.Document.body.scrollHeight;
    currentfr.Document.onkeydown=fpg;
    }
    if (currentfr.addEventListener)
    currentfr.addEventListener("load", readjustIframe, false)
    else if (currentfr.attachEvent){
    currentfr.detachEvent("onload", readjustIframe) // Bug fix line
    currentfr.attachEvent("onload", readjustIframe)
    }
    }
    
    var loadingDiv;
    loadingDiv = document.getElementById("loading");
    if (loadingDiv != null)
    loadingDiv.innerHTML="";
    self.focus();
    }
    - John
    ________________________

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

  4. #4
    Join Date
    Aug 2007
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Excellent, thanks for the help. I'll give that a shot

    Thanks again
    James

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
  •