Ajax和哈希网址

I have a webpage designed to reload data with ajax. All of my ajax works well but I now realize that I want to keep track of where you are on the page and also be able to link people to specific pages on the site.

Here is the site I am talking about:

www.stevenlebel.com

As you can see, the page is made up of a tv that loads new content into the screen. The videos page uses embedded Vimeo code, the music page uses Soundcloud and images use an Imugr gallery. The reason I built it this way was to allow my friend to update his page without my help.

So my question is, how do I add hash links to the URLS - I would also like to be able to link to a certain video, song or image on the page but am not sure whether this is possible using Vimeo/Soundcloud/Imgur.

Does anyone have any experience with this?

Thanks a lot,

katie

A bonus questions: Does anyone know how to remove the .html so when I use hash links the page would say x/x/#whatever instead of x/x.html#whatever?

If I understand your question correctly, You need HTML5 History API. There are some cool cross browser APIs of it you can use, have a look here http://html5demos.com/history to how it works.

You will need these things to keep track where you are. I consider you are not refreshing the page and using Ajax.

history.pushState Event, push any data with it and will be appended to url after #

history.popstate Event, use back/ forward to pop data.

window.hashchange Event, if you copy the url and open it to another or share it to anywhere. you will be able to fetch data after # in url.

You can try these cross browser APIs of it.

https://github.com/browserstate/History.js/

https://github.com/devote/HTML5-History-API

Good Luck!