Ad

How To Seamlessly Change Url Of Website

- 1 answer

I know this has been asked several times, but I just can't figure out how to change the url or render a new html and make it seem as if you never leave the site.

I want to do exactly what this site does:

http://uncharted.sunbrella.com/

Does it load all the content and just change the visible objects via javascript? Do they use angular states? I can't figure out how to get that effect of seamless transition between sections of websites.

Ad

Answer

Based on their page source code, it doesn't look like they're using angular, but you certainly could use it. If you did, I would recommend using ui router with multiple views on the page.

The secret to loading html dynamically is by using ajax to request data on the fly and updating the dom via javascript.

The site you referenced used css to make the page responsive and to prevent you from scrolling until you clicked a link. After clicking it looks like the content loaded outside of the view port so you don't see the data loading until you scroll.

Long story short, to point you in the right direction, I would urge you to learn more about ajax loading and css dom manipulations. If you are familiar with Angular, checkout ui router as it would allow you to easily setup multiple views on a page.

Ad
source: stackoverflow.com
Ad