I'm trying to build a new portfolio with a fixed position navigation on the left and then a horizontally scrolling div that you can also navigate by using the left menu. When an item is clicked I'd like it to smooth scroll to the corresponding anchor.

You can see what I'm trying to achieve here by clicking on the categories below 'Design': http://maxjquinn.com/Portfolio/design.html

I've removed all the javascript I've attempted from that page in order to have a clean slate as nothing seems to be working whatsoever.

I've been trying to debug it and what seems to be the problem is that the navigation isn't in the same div that is actually scrolling. To test/demostrate this, I've downloaded the demo from the following tutorial and modified it:http://tympanus.net/codrops/2010/06/...g-with-jquery/

If you have a look at my modified version (with my nav overlaid) below, you'll see that the links from the original tutorial work fine and it scrolls smoothly. However, if you try using the links from my nav bar (xoyo, the nest, and music correspond to section 1, 2 and 3 respectively) you'll see that it just jumps to the pages rather than scrolling.


Can anyone help me with some javascript code that allows me to utilize the smooth scrolling with my layout?

Thanks very much in advance!