Back button and scrolling positions are not easy on dynamic apps. What is easy on a statically generated page becomes quite hard in a dynamic app. On a statically generated page the back button and scrolling position is managed by the browser and the browser does a very good job to bring you back at the exact scroll location where you left off. On a dynamically generated app, it is not so easy and even the pros got it wrong: - Look at https://play.google.com/store/search?q=cat&c=apps - Apparently there are tons of application about cats... so let go through a few of them to find the most awesome cat's app. I keep scrolling and scrolling and every once in a while I see one that is promising and I want to see the details. But after I opened, I find out that is not the one I want. Now I click on the back button and ... booooo ... I am at the top of the list. Now I have to scroll down a few times until I find where I left off. I am kind of surprised to see thatGoogle has problems with this but they are in good company... - On https://www.facebook.com when you click on something on your newsfeed, it opens a new page. When you click back it tries to bring you back where you started but now the feed look different and even if you are scrolled at the same position there is something different on the viewport instead of the feed item you clicked on. Even if you you are in a person profile and you click on a person feed and then you click on a person that commented on a post, when you go back you are in the wrong position... mmmmhhh. - In Pinterest it works as desired: http://www.pinterest.com/search/pins/?q=cat They use an overlay div with overflow-y: scroll; position: fixed; right: 0; top: 0; bottom: 0; left: 0; and a higher z-index to show the details. If you click on a comment on the pin it close that overlay and bring you on a new page (the whole page is NOT reloaded but the dom changed) when you click the back button, the previous content is restored and it still bring you where you were on the page. Cool! - Twitter also does a good job to restore you in the right position!
I am using https://github.com/angular-ui/ui-router and by default the scroll behavior between different routes does not work as desired. What are the best practices to make it work? This is what I found so far: http://stackoverflow.com/questions/14107531/retain-scroll-position-on-route-change-in-angularjs and I wonder how good and robust these answer are. -- You received this message because you are subscribed to the Google Groups "AngularJS" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. To post to this group, send email to [email protected]. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
