jQuery를 사용하여 특정 픽셀까지 스크롤

jQuery를 사용하여 페이지를 특정 픽셀로 스크롤 다운 할 수 있습니까?jQuery를 사용하여 특정 픽셀까지 스크롤

스크롤 할 때 고정 된 탐색 모음이있는 웹 사이트를 구축하고 있으며 단추를 클릭하면 jQuery 부드러운 스크롤 플러그인을 사용하여 특정 고정 점으로 스크롤합니다.

문제는 탐색 모음이 섹션을 겹쳐서 텍스트의 절반을 잘라내는 것입니다.

jQuery 애니메이션 웹 사이트의 수가 늘어남에 따라 누군가가이 문제를 경험 했음에 틀림 없지만 대답을 찾지 못하는 것 같습니다.

나는 문제의 워드 프레스 웹 사이트의 부드러운 스크롤 플러그인을 설치 섹션 내부에이 코드가했습니다있다

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

총 세 부분으로 각 버튼에 스크롤해야합니다.

웹 사이트 URL : www.gogoblondie.com

출처

2013-04-22 Arran Scott

이상한 플러그인을 사용할 필요가 없습니다)
이 당신에게 아이디어를 제공해야합니다 :

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); 
});

출처

2013-04-22 21:24:12

scrollTo는 오프셋과 요소에 스크롤 할 수 있도록하는 좋은 jQuery 플러그인이다.

출처

2013-04-22 21:14:29 nullability

jQuery를 사용하여 특정 픽셀까지 스크롤

답변

관련 문제