Results 1 to 3 of 3

Thread: Iframe SSI script II - jumping to a specific location within the target html

  1. #1
    Join Date
    Aug 2012
    Thanked 0 Times in 0 Posts

    Question Iframe SSI script II - jumping to a specific location within the target html

    1) Script Title: Iframe SSI script II

    2) Script URL (on DD):

    3) Describe problem: I'm using the above script to display other html pages within an iframe. I'm wondering whether I could use this script to jump to a named anchor location within the target html file.

    I'm still developing the site so I couldn't give you a direct link to the site. Therefore I've pasted all the coding I'm using below (I stripped off most of the coding so that it would be easier for you to understand what I'm trying to do).

    The following coding is my main page where I've got the hyperlink

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "">
    <html xmlns="">
    <link rel="stylesheet" type="text/css" href="siteassets/Management_E-ssentials_main.css" />
    <script type="text/javascript">
    * IFrame SSI script II- © Dynamic Drive DHTML code library (
    * Visit for hundreds of original DHTML scripts
    * This notice must stay intact for legal use
    //Input the IDs of the IFRAMES you wish to dynamically resize to match its content height:
    //Separate each ID with a comma. Examples: ["myframe1", "myframe2"] or ["myframe"] or [] for none:
    var iframeids=["Content_iframe"]
    //Should script hide iframe from browsers that don't support this script (non IE5+/NS6+ browsers. Recommended):
    var iframehide="yes"
    var getFFVersion=navigator.userAgent.substring(navigator.userAgent.indexOf("Firefox")).split("/")[1]
    var FFextraHeight=parseFloat(getFFVersion)>=0.1? 16 : 0 //extra height in px to add to iframe in FireFox 1.0+ browsers
    function resizeCaller(){
    var dyniframe=new Array()
    for (i=0; i<iframeids.length; i++){ 
    var iframeid = iframeids; 
    if (document.getElementById) 
    //reveal iframe for lower end browsers? (see var above): 
    if ((document.all || document.getElementById) && iframehide=="no"){ 
    var tempobj=document.all? document.all[iframeid] : document.getElementById(iframeid)"block" 
    function resizeIframe(frameid){
    var currentfr=document.getElementById(frameid)
    if (currentfr && !window.opera){"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)
    function readjustIframe(loadevt) {
    var crossevt=(window.event)? event : loadevt
    var iframeroot=(crossevt.currentTarget)? crossevt.currentTarget : crossevt.srcElement
    if (iframeroot)
    function loadintoIframe(iframeid, url, hashtag){
    if (document.getElementById)
    if (window.addEventListener)
    window.addEventListener("load", resizeCaller, false)
    else if (window.attachEvent)
    window.attachEvent("onload", resizeCaller)
    <div class="mainframe">
    <a href="javascript:loadintoIframe('Content_iframe', 'toolkit2.html', 'Coaching')">Coaching</a>
    <iframe id="Content_iframe" src="home2.html" scrolling="no" marginwidth="0" marginheight="0" frameborder="0" vspace="0" hspace="0" allowtransparency="true"></iframe>
    Please be patient with me because I'm a newbie to javascript and this is my first time in the forum.

    I was thinking of adding a third parameter to the hyperlink so that I can pass on the name of the anchor to the loadintoIframe function. <a href="javascript:loadintoIframe('Content_iframe', 'toolkit2.html', 'Coaching')">Coaching</a>. However because of my "newbieness"... I don't know how to use it within the javascript to make the loaded page (toolkit2.html) to then jump to that named anchor.

    I would greatly appreciate if anyone can help me out.

    Many thanks


  2. #2
    Join Date
    Mar 2005
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries


    If you want to load the page to a named anchor, named anchors designated by the hash (#) are part of a standard URL, so that's the first thing I'd try:

    <a href="javascript:loadintoIframe('Content_iframe', 'toolkit2.html#Coaching')">Coaching</a>
    This assumes that toolkit2.html has a named anchor on it by the name of Coaching and that it's far enough down the page to make a difference. It should work and if it does, requires no other modifications to the script.

    If there is a problem, first make sure you can:

    <a href="javascript:loadintoIframe('Content_iframe', 'toolkit2.html')">Coaching</a>
    and that works to at least load the page.
    - John

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

  3. #3
    Join Date
    Aug 2012
    Thanked 0 Times in 0 Posts

    Thumbs up Thank you!

    D'oh! Forgive me I must have been having a blond moment yesterday. When I was testing this out yesterday, I did first try it out the normal method but it didn't work.

    <a href="javascript:loadintoIframe('Content_iframe', 'toolkit2.html#Coaching')">Coaching</a>
    That's why I tried thinking of passing the anchor name seperately, googling for answers, posting this question on the forum, etc. However when I read your reply today, it made me think there must be something wrong with my original coding for it to not work. So I went back and re-did all the anchors and Voilą! it's all working like a charm!

    Apologies again if I've wasted your time jscheuer1, but I'm glad that I did post the question because if it weren't for your reply, I wouldn't have thought to re-check my coding. A big lesson for me.... "Check and re-check your coding before you start asking questions".

    Thank you very much and thanks Dynamic Drive for the script!



Posting Permissions

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