jQuery平滑滾動返回錯誤在第一個錨點

Question

我想使用平滑滾動去我的主頁上的錨點。我用這個jQuery代碼：

$(document).ready(function(){ 
    $('a').click(function(){ 
     $('html, body').animate({ 
      scrollTop: $($.attr(this, 'href')).offset().top 
     }, 1000); 
      return false; 
    }); 
}); 

這是HTML代碼：

<div id="menu"> 
     <div id="menu-contain"> 
      <ul> 
       <li><a class="home" href="#">Home</a></li> 
       <li><a class="about" href="#about">About</a></li> 
       <li><a class="projects" href="#projects">Projects</a></li> 
       <li><a class="contact" href="#contact">Contact</a></li> 
      </ul> 
     </div> 
    </div> 

這適用於每一個錨，但第一個相當精細。如果我有一個看看控制檯有一個錯誤，如果我點擊第一個鏈接：

Cannot read property 'top' of undefined 

我發現很多線程的這個錯誤，但我沒有找到這對我的作品的解決方案。

建議表示讚賞:)

Answer 1

檢查你的目標元素的存在，使用前：

$('a').click(function(){ 
    var $target = $($.attr(this, 'href')); 

    if (! $target.length) return; 

    $('html, body').animate({ 
     scrollTop: $($.attr(this, 'href')).offset().top 
    }, 1000); 

    return false; 
}); 

你也應該有你的緩存選擇。 See this thread for more details。