Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations Mike Lewis on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

how to properly emulate forward/backward buttons for an iframe

Status
Not open for further replies.

shadedecho

Programmer
Oct 4, 2002
336
US
I have a little widget that I've been working on which creates a virtual "browser window" that you can drag around your page, resize, etc. It contains in it an iframe, which the user can load up with any arbitrary page (including those not on the domain of the hosting page), like google.com for instance.

I want to provide emulation of forward/backward buttons in the "chrome" of the virtual window (along with the close, maximize, resize, etc buttons). So, necessarily, I need to be able to control the history of the iframe, both forward and backward. But I cannot do so based on anything internal in the iframe (like 'location'), as its contents are completley arbitary and not controlled by my widget. Moreover, cross-domain restrictions prevent any direct access to its location object, or its history object.

So, I'm left with the observation that an iframe automatically seems to add its history on top of the main browser's history. It also appears that controlling the main window's browser history correctly (sort of) controls the iframe's history, so this almost accomplishes what I want.

However, herein lies the rub:
I don't want the user to be able to click "back" too many times, such that they actually leave the page hosting the virtual window. So I need to limit the history button to going back only so far as where the history was when the virtual window was first opened. Similarly, I don't want the forward button to allow a user to go "forward" so far as to leave the page hosting the virtual window -- they should only be able to go as far as the history that was added while inside the virtual window.

Since these virtual window history items will be added primarily through user navigation inside that window, which prevents the hosting page virtual window widget code from accessing it, again, I can only rely on navigating the main browser's history, but stopping at the appropriate bounds either at the beginning of the virtual history, or the end of it.

Determining those "bounds" is my problem at the moment. This "history.length" property seems like it would be useful, but it gets wonky when you navigate around in the list with back() and forward(). But this may be the only hope, I just need to figure out some way to properly handle/access the value and use it.

The "history.current", "history.previous" and "history.next" properties, which USED to work in browsers, no longer seem to be supported, and so they cannot be used for this purpose. :( Big bummer.

---------------------------
I should also say:
I don't need a history manager from any of the frameworks... I've looked at all of them. those are designed to do the opposite thing, which is to allow virtual inserts of history (like ajax events) and bookmarking of these states, and so forth. I need the opposite, which is to be able give the user a way to navigate the automatically (and thus cross-domain inaccesible) browsing history, programtically through custom buttons.
 
Two things spring to mind:

1. Your assumption about how the back button works with iframes is incorrect when looking at browsers other than IE. Take this example:

- You load a page with two empty iframes on it. After page load, both of those iframes have content loaded into them.

In IE6, you'd have to hit the back button 3 times for the main page to go back - the first hit unloading the first iframe's content, the second the second, and the third taking the main page back.

In Fx2, you only have to hit back once (I guess it doesn't add iframe activity to the main page history).


2. You might be out of luck with a pure client-side solution because of cross-domain scripting restrictions. It is possible that you could get around this by passing all pages to display in that iframe through a server-side proxy and dynamically rewriting all links & content to go via your domain & proxy... but this will probably be hard to get 100% accurate.

Hope this helps,
Dan



Coedit Limited - Delivering standards compliant, accessible web solutions

Dan's Page [blue]@[/blue] Code Couch:
Code Couch Tech Snippets & Info:
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top