Smooth Scrolling Problem

Smooth Scrolling Problem

Hello, I'm having a problem implementing smooth scrolling on a page I am building. I have a header which contain links to different anchor targets within a div lower on the page.

I have used this code to acquire the smooth scrolling transitions:
  1. $(document).ready(function() {
      function filterPath(string) {
        return string
          .replace(/^\//,'')
          .replace(/(index|default).[a-zA-Z]{3,4}$/,'')
          .replace(/\/$/,'');
      }
      $('a[href*=#]').each(function() {
            if ( (filterPath(location.pathname) == filterPath(this.pathname))
            && (location.hostname == this.hostname)
            && (this.hash.replace(/#/,'')) ) {
                var $targetId = $(this.hash), $targetAnchor = $('[name=' + this.hash.slice(1) +']');
                var $target = $targetId.length ? $targetId : $targetAnchor.length ? $targetAnchor : false;
                 if ($target) {
                 var divOffset = $target.parent().offset().top;
                 var pOffset = $target.offset().top;
                 var pScroll = pOffset - divOffset;
                 $(this).click(function() {
                     $target.parent().animate({scrollTop: pScroll + 'px'}, 500);
                     return false;
                 });
                }
            }
      });
    });























Unfortunately, it doesn't work how it's intended to, and jumps to what seems like random points of the div, instead of where I have targeted it. If someone could have a look at the page (link below) I would be truly grateful!

johnwilliamwalters.co.uk/cv.html

Thanks, John