How to handle back button between IE and FF/Safari

Question

I am developing a web site where I would like to be able to have content on a page change, and have the URL change as well. (i.e. mysite.com/test#firstcontent changed into mysite.com/test#othercontent). I have got it working perfectly in all browsers to change the URL hash, but the back button in IE redirects me to the URL before ALL the hash changes. Sorry to be so repetitive but here is what my users would do:

1. Start at mysite.com/test
2. Navigate on the same page to mysite.com/test#new
3. Then to mysite.com/test#new2

If the user hits the back button in any browser (besides IE) it will go from Step #3 to #2 to #1. However IE forces them all the way back to the URL before #1. How can I get IE to recognize the hash difference as a "page change" if you will, so that navigation will go between steps, and not URL's.

I apologize for being too wordy, however I can not find an answer for this anywhere and need to be clear. Thanks in advance!

Answer 1

In IE you have to have an IFRAME that somehow helps manage the history.

This seems to be a thorough article on the subject. An excerpt:

The problem in IE comes from the fact that it doesn't create a history entry when the hash changes. This can be worked around by navigating an iframe in addition to changing the hash as IE does create a new history point every time a frame is navigated.

See also this post about jquery history management plugins.

BTW - In general you might want to consider using some JavaScript framework that helps shield you from cross-browser quirks like this.