Build site with content sliding in, static header etc

[jmiddel]

Site has header, nav, main-div and footer. I want main-divs of pages 1-7 with all their content to slide in from left/right depending on their position in the nav bar, while the other elements stay put. I've googled this for hours, but just get slide shows and other not relevant stuff. Must be missing the right term for this.

Thank you!

 

[960design]

Site has header, nav, main-div and footer. I want main-divs of pages 1-7 with all their content to slide in from left/right depending on their position in the nav bar, while the other elements stay put. I've googled this for hours, but just get slide shows and other not relevant stuff. Must be missing the right term for this.

Thank you!

SPA ( single page application ) is what you are looking for. But if you are asking questions about it on an Apple forum it may be a little beyond your current programming capabilities.

You could do exactly what you are looking to do with just a little javascript as well, but it will not be an optimized solution without using some AJAX ( hence the SPA recommendation ).

Build your site with a div for each content:

<div id='nav-item-1'>Page Stuff goes here</div>
<div id='nav-item-2'>More page stuff</div>

Hide every div using CSS ( display: none; ) except for the 'Home' page.

Then as users click nav items, capture the click using javascript and 'slide' the div in from the left or right.

Good luck and post us a link in JSFiddle when you have trouble or have solved it!