使用jQuery向下滾動到一定數量的像素

Question

您可以使用jQuery向下滾動頁面到某個像素嗎？

我正在構建一個網站，滾動時有一個固定的導航欄，當點擊一個按鈕時，它將使用jQuery平滑滾動插件滾動到某個錨點。

問題是導航欄與該部分重疊，因此它將一半的文本關閉。

隨着越來越多的jQuery動畫網站，我敢肯定有人肯定有過這個問題，但我似乎無法找到答案。

我已經安裝了有問題的WordPress的網站上的平滑滾動的插件，並有這樣的代碼段內：

<div id="web"></div>, <div id="app"></div>, <div id="seo"></div> 

有總共三個部分，每個部分按鈕應該滾動。

網址：www.gogoblondie.com

Answer 1

沒必要用奇怪的插件;）
這應該給你一個想法：

LIVE DEMO

<nav> 
    <ul> 
     <li><a href="#web">WEB</a></li> 
     <li><a href="#app">APP</a></li> 
     <li><a href="#seo">SEO</a></li> 
    </ul> 
    </nav> 

    <div id="web" class="page" style="margin-top:200px;">WEB</div> 
    <div id="app" class="page">APP</div> 
    <div id="seo" class="page">SEO</div> 

CSS：

nav{ 
    position:fixed; 
    top:0px; 
    width:100%; 
    height:200px; 
    background:#cf5; 
    z-index:2; 
} 
.page{ 
    position:relative; 
    min-height: 800px; 
} 

JQ：

var navHeight = $('nav').outerHeight(); 

$('nav a').click(function(e){ 
    e.preventDefault(); 
    var myHref = $(this).attr('href'); 
    var newPos = $(myHref).offset().top; 
    $('html, body').stop().animate({scrollTop: newPos-navHeight}, 1300); 
}); 

Answer 2

scrollTo是一個很好的jQuery插件，可以讓您滾動與偏移的元素。