Good day All:

I was wondering if anyone have had experience dealing with the browser history inside an Iframe. Specifically, how to navigate with the back button throught the history inside the Iframe ONLY, and not the entire page.

I have an Iframe that is called inside my page like so:

$(document).ready(main);



    function main()
    {
        $('iframe').attr('src', getIframeUrl() );
        registerEvents();
        resizeIframe();
    }

    function getIframeUrl()
    {
        var url = window.location.href;
        var iframe_url = 'http://samplepage.com';
        var param_start = url.indexOf("iframe=");
        if( param_start != -1 ) 
            iframe_url = url.substr(param_start+7,url.length-param_start-7);
        if( iframe_url.indexOf("http://") == -1) 
            iframe_url = "http://" + iframe_url;

        return iframe_url;
    }  

and inside my html

<div id='direc' name="direc">
<iframe align="center" width="100%" height="90%" src="" name="iframe" id="iframe"> </iframe>    </div> 

I have embedded a back button inside the iframe, like so:

<a id='back' href='javascript:void();' onclick="self.history.back(-1)" title='Go Back'><img src="images/back_arrow.png" width='40' height='40'></a> 

and I have tried any number of suggestions for the onclick event with not much success. I have tested the following:

onClick="directory.history.back()"//directory being the name of the iframe
onClick="iFrame.contentWindow.history.back()"  

May I ask for some help?

Thank you,
Mossa

Solved!

function back(){
    document.getElementById('iframe').contentWindow.history.back(-1);
}
Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.