How to make a "navigation slide"

Gavin "shels"

Probably not the best title but posting this for a mate.

Basically he's buliding a website in Wordpress, his plan is to have a Homepage, where he will have a Logo at the top and a Nav bar underneath that both of which he wishs to keep as a "template" and be there for every page.

Now his idea is to have articles accessible from the homepage, each will direct you to a new page, now the way he wants the pages is so that say the articles are over 3 pages, he wants to be able to click say a forward and back navigation button (similar to a slide of photos) to go through the whole article.

Which would be the best way to go about this? HTML/CSS? Javascript?

Giblet

i would build it in pure HTML & CSS without any javascript. When that's all working, he can work on improving the behaviour with javascript.
In wordpress, he would need to create a header template for the navigation.
For the page he wants to have pagination on, he would just create three pages, and have context relative links. ie: On the first page he would have a next, on the second, have both, and the last, only a previous. He can then work on getting some sort of behaviour (ajax loading, sliding whatever) after all of that works. Then he could try figure out a way to automatically create the navigation based on some sort of page grouping. I think wordpress has a few pagination examples.

Gavin "shels"

Cheers. He's never done Javascript so I was swaying him away from it for the time being.

28064212

Is there a reason he doesn't simply want 3 pages with a link at the bottom to next and previous? Using Javascript to dynamically load content creates issues with search engines, as well as having to cater for people who have JS switched off

Giblet

That's why he should create the page purely in HTML & CSS and then enhance the behaviour with JavaScript, so it has a working fall back. I agree though, you should never resort to loading content via XHR, only if it is necessary! (It rarely is, and really kills phones if a lot of content is parsed from an XHR request). Having the working implementation enhanced slightly though is a workable solution, provided you aren't doing a lot of JavaScript templating after you've loaded the content! (A simple innerHTML call is usually fine). Back button # hacks are also a nightmare.

Gavin "shels"

28064212 wrote: »

Is there a reason he doesn't simply want 3 pages with a link at the bottom to next and previous?

It's just the design he's looking for.