How to Link to an Anchor in iFrame

Save

Adding an iframe to your Web page can be an effective way to show content from another Web page without sending your readers elsewhere to see it. However, one of the problems that you might face when using an iframe is that you might want to direct your readers to a specific part of the embedded page in the iframe. You must be able to link to an anchor in an iframe to do this.

  • Log in to your Web server.

  • Open the HTML page in which you will include the iframe and the anchor tag.

  • Place this script on the page between the <head> and </head> tags:

    <script>

    function loadorder() {

    document.getElementsByName("iframename")[0].src= "http://www.website.com#anchortext"

    window.scrollTo(0,0)

    }

    </script>

  • Click your cursor at the location in the<body> section of the page where you want to insert the iframe.

  • Insert this code:

    <iframe width="830" src="http://www.website.com#anchortext" height="500" scrolling="yes" frameborder="0" id="iframename" name="iframename" style="top: 200px; left: 0px; position:absolute" onLoad="loadorder();"></iframe>

  • Replace both instances (in the <head> and the <body>) of "http://www.website.com#anchortext" with the actual URL and the actual text on the embedded iframe page that will serve as the anchor.

    For example, if the embedded page were "http://www.fishing.com" and the text on the page to which I would anchor were "Catch a Fish," I would write "http://www.fishing.com#Catch a Fish"

  • Change the iframe height and width settings if desired.

  • Publish the page.

References

Promoted By Zergnet

Comments

Resources

You May Also Like

Related Searches

Check It Out

Geek Vs Geek: Robot battles, hoverboard drag race, and more

M
Is DIY in your DNA? Become part of our maker community.
Submit Your Work!