When a link is clicked on facebook, the top header bar doesn't flicker at all. I'm used to seeing this effect on pages where the content is loaded via ajax, but on Chrome, the url is changing, and, so far as I know, that means that a new page was loaded.

In javascript, I know the url can't be changed without a redirect, but the hashtag can, so I'm finding this very intriguing. I thought this might be something chrome does, where it loads a webpage before taking you off the previous one to create a seamless experience, so I tried it on Internet Explorer. On IE, the same effect is made, but this time the url doesn't change, just the hashtag. I tried on FireFox as well, and it changes the URL the same way chrome does.

What's going on here?

有帮助吗?

解决方案

Yes, it's loaded with AJAX. And the urls are changed by manipulating the history. A nice library called HistoryJS also wraps this functionality for non-supporting browsers using hash changes.

其他提示

Not sure if it's the case on Facebook, but the History API lets you programmatically change the URL - as long as you comply to the same origin policy. GitHub is a great example of using this technique unobtrusively.

In modern browsers, it's possible to update the URL without reloading the page, via the history.pushState() function.

Example:

history.pushState({}, "", "foo.html");
许可以下: CC-BY-SA归因
不隶属于 StackOverflow
scroll top