스크롤로 다른 ID 버튼 링크

아래로 스크롤하면 페이지의 다음 ID로 이동하는 하나의 아래쪽 화살표를 만들려고합니다. JavaScript를 모르므로 가능한 한 간단하게 유지하려고합니다. 나는 단지 몇 개의 섹션 만 있기 때문에 다른 타겟을 가진 화살표로 다른 div를 숨기고 표시 할 수 있다고 생각했습니다. 나는 이것에 도착하기 위해 두 가지 다른 코드를 사용했으나 작동하지 않는 것 같습니다. 어떤 아이디어?스크롤로 다른 ID 버튼 링크

<script type="text/javascript"> 

$(window).scroll(function(){ 
    if($(window).scrollTop() >= 800) { 
     var elem = document.getElementById("arrow"); 
     elem.setAttribute("style","display:none;"); 
    } else { 
     elem.setAttribute("style","display:inline;"); 
    } 
}); 

</script>

출처

2013-05-27 amj

이 JS에서 몇 가지 오류가있는 것 같습니다 :

//When the document is ready... $(function(){ //Select the arrow just once var arrow = $("#arrow"); //Attach a scroll event to the window $(window).scroll(function(){ //See what the scroll position is var scrollPos = document.body.scrollTop; //When the document has scrolled to a certain point or more, hide the arrow. //Otherwise, show it. if(scrollPos >= 800){ arrow.hide(); } else { arrow.show(); } }); });

여기에 행동에 그것의 간단한 데모입니다. window.scroll의 elem 변수 outisde를 선언해야합니다. jQuery를 사용할 때 var elem = $ ("# arrow"); – Chris

제안 해 주셔서 감사합니다. 다른 예제에서 발견 된 코드를 사용하려고했습니다. 아마도 나는 그것을 어떻게 사용하는지 오해했습니다. – amj

은 내가 당신이 원하는 정확히 이해 모르겠지만, 당신의 코드는 jQuery를 제공하는 단축키를 활용하여 조금 단순화 할 수있다. http://jsfiddle.net/Bt35Q/

출처

2013-05-28 00:03:56

완벽하게 도와 주셔서 감사합니다. jquery 스크립트를 호출하기 전에 헤더에 스크립트를 넣었습니다. 문제가 발생했을 수 있습니까? – amj

예,이 스크립트는 jQuery 라이브러리를 사용하기 때문에로드 된 후에 발생해야합니다. 다행이 당신을 위해 일했다! 당신이 괜찮다면 최종 해결책이라면 받아 들일 수있는 것으로 대답 해주세요 :) –

스크롤로 다른 ID 버튼 링크

답변

관련 문제