jquery sticked 위아래로 스크롤 화살표

Question

일부 섹션으로 나뉘어 진 웹 페이지를 스크롤 할 수있는 페이지 arroys 중간에 2 개의 sticked (위로 및 아래로)를 추가하려고합니다. 따라서 화살표는 항상 가운데 부분의 두 번째 섹션에서 마지막 섹션으로 이동하여 페이지를 위 또는 아래로 스크롤 할 수 있습니다.

the jsfiddle is this

STRU을 :

현재 내가 나에게주는 웹 페이지

.content-wrap section .back-to-top { 
    display: block; 
    position: absolute; 
    bottom: -65px; 
    right: 10px; 
    height: 36px; 
    width: 36px; 
    background: url(http://www.caddet-re.org/assets/images/Arrow_Circle_Up.gif); 
    text-indent: -9999px; 
    z-index: 2; 
} 
<a class="back-to-top" href="#main">Back to Top</a> 

의 상단에 나를 소요 버튼이 있습니다 섹션의 가능한 화상이다 : 나는 당신의 코드를 약간 변경 한

<div class="content-wrap"> 
    <section id="main"> 
     <!--content--> 
     </section> 

     <section id="portfolio"> 
     <!--content--> 
    </section> 
     ... 
</div> 

Answer 1

:

http://jsfiddle.net/BorisDutkin1982/ZapgY/1/

내가 그 당신이 무슨 뜻인지를 바랍니다. "Down"버튼도 추가 할 수 있습니다 : top:45%을 제외하고 "화살표 - 컨테이너"안에 있고 CSS 매개 변수는 이고 "위로"버튼과 같아야합니다. bottom:45%으로 변경하십시오.

두 번째 섹션 이후에만 화살표를 표시하려면 에 "스크롤링"이벤트 리스너를 추가하고 사용자가 페이지를 스크롤 한 위치를 확인해야합니다.

$(document).ready(
    function(){ 
     $("body").live(
     "scroll", 
      function(){ 
      if($("body").scrollTop == NUMBER_OF_PIXELS_FROM_TOP_OF_THE_PAGE){ 
       $("arrow").show(); 
      } 
      } 
    ); 
    } 
); 

Explanaition : 당신은 scrollTop() 방법 ... 은 예를 들면 코드로 할 수있는 나는 "몸"에 조치를 스크롤의 청취자를 추가했다. 페이지 상단에서부터 두 번째 섹션까지의 거리가 사용자의 경우 본문/페이지를 스크롤 할 때마다 화살표가 표시됩니다.