확인 활성 사업부의 온로드

Question

내가 레이아웃

<nav id="main-nav"> 
    <a href="#link1">Link1</a> 
    <a href="#link2">Link2</a> 
    <a href="#link3">Link3</a> 
</nav> 
<div id="link1"> 
    some content goes here 
</div> 
<div id="link2"> 
    some content goes here 
</div> 
<div id="link3"> 
    some content goes here 
</div> 

이 같은 것을 사용하고 그래서 그것은 올바른 DIV 아래로 스크롤합니다. NAV는 고정 된 위치에있는 메뉴이며 상단에서 200 픽셀을 사용합니다. 내가 스크롤 사용 JS는 이것이다 :

$('#main-nav a').click(function(event) { 
    var nome = $(this).attr("href"); 
    $('html, body').animate({ 
     scrollTop: $(nome).offset().top-198 
    }, 1600); 
}); 

좋아, 그래서 탐색 링크가 될이 내부 페이지있다 :

<a href="http://www.mysite.com/#link1">Link1</a> 

문제는이 집이 확인로드이다는하지만, div는 NAV에서 맨 위부터 시작합니다 (페이지가로드 될 때 offset().top-198이 없기 때문입니다). 내가 필요한 것은 #link을로드하고있는 URL에서 onLoadscrollTop을 얻는 방법을 찾는 것입니다.

아무 도움이 필요하십니까?

Answer 1

URL에서 현재 해시 태그를 찾은 다음 해당 ID를 divs ID와 일치시킨 다음 해당 ID를 애니메이션으로 만들 수 있습니다.

$(function(){ 
    currentPage = window.location.hash; 
    moveLink = $('div').find($(this).attr('id',currentPage)); 
    $('html, body').animate({ 
     scrollTop: $(moveLink).offset().top-198; 
    }); 
}); 

편집 ---------------------------------------

var aniFunc = function(a){ 
    $('html, body').animate({ 
     scrollTop: $(a).offset().top-198; 
    }); 
}; 

$(document).ready(function(){ 
    currentPage = window.location.hash; 
    moveLink = $('div').find($(this).attr('id',currentPage)); 
    aniFunc(moveLink); 
} 

$('#main-nav a').click(function(event) { 
    nome = $(this).attr("href"); 
    aniFunc(nome); 
}); 

Answer 2

당신은 intitially 그런 일 할 수있는 :

window.location.href.match('(#.*$)') 

및 페이지로드에 해당 요소에 클릭을 트리거합니다.