CODEWITHSUNDEEP
javascriptinternet-exploreronclickinternet-explorer-9browser-history
David
David

Reputation: 1245

IE9 Back button not working properly with anchor divs

This is an IE specific problem, as far as I can tell, and I have been experiencing it in IE9.

If you view this jsFiddle: http://jsfiddle.net/dvrcthewrld/uaP3v/17/ you'll probably find that it works fine in the frame. That is: only when the modal is visible, clicking on either the offset div or the overlay div results in a history.back event, causing the modal to disappear.

<div id="dbw" name="dbw" class="dumbBoxWrap">
    <div class="dumbBoxOverlay" onclick="history.back()" >
        &nbsp;
    </div>
    <div class="vertical-offset" onclick="history.back()" >
        <div class="dumbBox" onclick="event.stopPropagation ? event.stopPropagation() : (event.cancelBubble=true)
;">
    <p>Content goes here</p>
        </div>
    </div>
</div>

However, if you view it full, not in a frame: http://fiddle.jshell.net/uaP3v/18/show/ then you will find that IE9 appropriately changes the url, but that the modal does not disappear as expected. This happens whether the back event is triggered by clicking the divs or using the browser's back button.

This appears to be a bug in IE9, and I assume earlier versions as well. Is there an appropriate way to handle this without drastically revising my code?

Upvotes: 0

Views: 649

Answers (1)

epascarello
epascarello

Reputation: 207521

It is a hacky solution, but it seems to work

window.onhashchange = function(){
    document.body.className = document.body.className + "";
}

Running example: jsFiddle

Upvotes: 1

Related Questions