开发者

How do I achieve the "GitHub browse repo effect" (update URL without refreshing the page)

开发者 https://www.devze.com 2023-03-19 20:09 出处:网络
When I browse a repo in GitHub (example: https://github.com/sizzlelab/kassi) and click a folder, it loads the folder with a cool javascript animation, moving stuff to the left, instead of reloading th

When I browse a repo in GitHub (example: https://github.com/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 en开发者_运维技巧vironment is jQuery and rails, but a general advice will help also.


what you want is watch this screencast: http://railscasts.com/episodes/246-ajax-history-state

in combination with jQuery UI effect "slide" - http://docs.jquery.com/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".

0

精彩评论

暂无评论...
验证码 换一张
取 消