When I browse a repo in GitHub (example: ) and click a folder, it loads the folder with a cool javascript animation, moving stuff to the left, instead of reloading the whole page. However, the URL of the page is still updated on every click.
How do I achieve this? To my knowledge, you cannot update the page URL from javascript, so you need to refresh the page. My guess is that they do a partial caching of the page so that it does not seem to reload and then run the javascript animation after reload. Am I on the right track? Any pointers on how this can be achieved? My environment is jQuery and rails, but a general advice will help also.
When I browse a repo in GitHub (example: https://github./sizzlelab/kassi) and click a folder, it loads the folder with a cool javascript animation, moving stuff to the left, instead of reloading the whole page. However, the URL of the page is still updated on every click.
How do I achieve this? To my knowledge, you cannot update the page URL from javascript, so you need to refresh the page. My guess is that they do a partial caching of the page so that it does not seem to reload and then run the javascript animation after reload. Am I on the right track? Any pointers on how this can be achieved? My environment is jQuery and rails, but a general advice will help also.
Share Improve this question asked Jul 12, 2011 at 7:58 KustiKusti 1,3592 gold badges10 silver badges18 bronze badges 3- Saw this today and was also curious. But not enough to dig in :( – Jordan Commented Jul 12, 2011 at 8:02
- possible duplicate of GitHub Slider JQuery Plugin... – Merlyn Morgan-Graham Commented Jul 12, 2011 at 8:13
- Merlyn: yeah, that question is close, but I'm more interested in the method of updating url via refreshing the page than the actual slide effect they have in GitHub, and there seems to be no answers to that in the other question. But thanks for the ment! – Kusti Commented Jul 12, 2011 at 12:58
2 Answers
Reset to default 5what you want is watch this screencast: http://railscasts./episodes/246-ajax-history-state
in bination with jQuery UI effect "slide" - http://docs.jquery./UI/Effects/Slide
good luck!
You can read about this behaviour in spec — History API and on MDN in section "Adding and modifying history entries".