history.js provides an implementation of the HTML5 history API: history.pushState
and history.replaceState
functions, as well as the window.onpopstate
event.
Browsers that already support his event (Chrome & Safari, Firefox 4+) use native implementations, which are able to change the page URL without refreshing the page. Older browsers use location.hash
in order to mimic the official behavior.
1214 bytes minified / 588 bytes gzipped
Include the script file in your HTML file:
<!-- Include JSON if you want to support older browsers -->
<script type="text/javascript" src="json2.js"></script>
<script type="text/javascript" src="history-min.js"></script>
Same as the official HTML5 API:
// Switch to the item
window.history.pushState({ id: 35 }, 'Viewing item #35', '/item/35'});
// Single handler
window.onpopstate = function (e) {
var id = e.state.id;
load_item(id);
};
// Multiple listeners using addEventListener
window.addEventListener("popstate", function callback1(event) {
var id = e.state.id;
load_item(id);
}, true);
window.addEventListener("popstate", function callback2(event) {
do_something_else(e.state);
// remove one single listener
window.removeEventListener("popstate", callback2, true);
}, true);
Any use allowed in the standard but not supported by this API is considered a bug.
- Chrome 5+ & Safari 5+ (Native)
- Firefox 4+ (Native)
- Firefox 3.5+
- Chrome 4+
- Safari 4+
- IE8+
- Opera ?
- IE6-7
- Safari 3+ (No persitence)
- Chrome 3+ (No persitence)
- Firefox 2+ (No persitence)
- Support IE6&7
- Use
iframe
for history - Use
userData
behavior for persistence
- Use
- Support FF2+
- Use
globalStorage
for persistence
- Use
- Chrome < 4
- Use Gears?
- Fallback for browsers that are unsupported