【jQuery】offset().topのエラーを回避してスクロール位置を表示するナビを作成！

$(function() {
 //ナビ部分を指定
 var currentNav = $('#current_nav li a'); 
 var contentsArr = new Array();
 for (var i = 0; i < currentNav.length; i++) {
  var targetContents = currentNav.eq(i).attr('href');
  if(targetContents.charAt(0) == '#') {
   if ($(targetContents).length) {
       var targetContentsTop = $(targetContents).offset().top;
   }
 var targetContentsBottom = targetContentsTop + $(targetContents).outerHeight(true) - 1;
 contentsArr[i] = [targetContentsTop, targetContentsBottom]
  }
 };
 function currentCheck() {
  var windowScrolltop = $(window).scrollTop();
  for (var i = 0; i < contentsArr.length; i++) {
   if(contentsArr[i][0] <= windowScrolltop &amp;&amp; contentsArr[i][1] >= windowScrolltop) {
    //位置に来たら付与されるクラス名
    currentNav.removeClass('current');
    currentNav.eq(i).addClass('current');
    i == contentsArr.length;
   }
  };
 }
 $(window).on('load scroll', function() {
  currentCheck();
 });
 currentNav.click(function() {
  $('html,body').animate({
   scrollTop: $($(this).attr('href')).offset().top
  }, 300);
  return false;
 })
});

$(function() {
 //ナビ部分を指定
 var currentNav = $('#current_nav li a');

最初にナビ部分のHTMLを指定します。

今回は、#current_navというIDで括った中のliの中のaをナビ部分として指定しています。

currentNav.click(function() {
  $('html,body').animate({
   scrollTop: $($(this).attr('href')).offset().top
  }, 300);
  return false;
 })
});

この部分は、ナビをクリックしたときのスムーズスクロールを記述しています！