在单页网页设计上实现链接

Question

Simply put: I have a single-page website, for instance www.example.com. How do I make a link pointing to www.example.com/sub not trigger an unload, but still change the address bar as if it did?

example1

example2

Answer 1

HTML History API can do this.

history.pushState({data: "foo"}, "SubPage", "http://www.example.com/sub")

You can kind-of use History JS to shim it in for the older browsers (it will fake it with hash links in non-compliant browsers).