Question

My problem here is that I don’t have the vocab to search for examples of this style of menu to learn how to achieve it. If anyone could point me in the right direction I’d appreciate it!

I am trying to create a fixed header menu, with a set of panels which use images to represents different sections of a lengthy web page (navigation would all be on one page, but within that page).

There would be about 12 or thirteen different images, so I need to be able to scroll back and forward horizontally between the thumnails of the various parts of the page.

I have drawn a concept sketch here:

You can see in my example I have one graph displayed, but many others above and below it on the page, and a highlighted square to sit over the user’s current position (or at least last selection, to keep things somewhat simple).

I’m not asking you guys to code this for me! But when I search for things like “jquery sliding bar menu”, or “jquery thumbnail menu” I’m hitting dead ends, but I am SURE this is the kind of thing jquery would be great at. I’m pretty new to javascript, and mainly just re purpose existing scripts, so any advice for how I could reach this would be really appreciated. Thanks!

Answer 1

You’re probably looking for a carousel: jCarousel

Then, add a click event to the carousel items which would load/show the respective graphs/images on the container below it.