2014-02-07 5 views
2

7 월 10 일에는 비슷한 질문이 있습니다. (See here)
그 당시 최고 대답은 달성되지 못했습니다.어떻게 스크롤 막대를 놓을 수 있습니까?

누구나 지금 어떻게 될지 알고 있습니까?
내가 여기를 본 적이 : 당신이 줄을 스크롤하면 http://www.beoplay.com/Products/BeoplayA9
, 기본 동작보다 더 아무것도 없다,
는 당신은 가장 가까운 섹션 가기 사이트 스크롤 놓을 때.

여기에 트릭이 있습니까?

모든 나는 비슷한 효과를 달성하기 위해 함께 올 수있는 것은 '.unvisible 핸들러'

을이

<!DOCTYPE HTML> 
<html> 
<head> 
<style type="text/css"> 
    .fake-bar { 
     position:fixed; 
     height:100%; 
     width:15px; 
     right:0; 
     overflow-y:scroll 
    } 
</style> 
</head> 

<body> 

    <section style="height:500px">page 1</section> 
    <section style="height:500px">page 2</section> 
    <section style="height:500px">page 3</section> 
    <section style="height:500px">page 4</section> 

    <div class="fake-bar"> 
     <div style="height:2000px;"></div> 
    </div> 

    <div class="fake-bar"> 
     <div class="invisible-handler"></div> 
    </div> 

</body> 
</html> 

같은 사이트의 상단에 몇 가지 고정 된 사업부를 추가 한 다음 결합했다 하지만 더 쉬운 방법이있을 수 있습니다.
B & O 사이트는 스택 div를 사용하지 않는 것 같습니다.

누구나 완료 방법에 대한 단서가 있습니까?

+0

이 또한 스크롤 계정으로 마우스 가운데 스크롤 및 중간 마우스 클릭을 할 필요합니까? 왜 스크롤 이벤트를 사용하고 멈출 때를 감지 할 수 없습니까? 세 가지 경우와 다른 모든 경우를 처리해야합니다. –

+0

@KevinB : 아니요, 실제로 사이트를 스크롤하는 다른 모든 이벤트 (위/아래 화살표, 마우스 휠, 스페이스 바 등)는 false를 반환하고 다른 방식으로 처리됩니다. 그래서 oGeez는 회장과 잘 맞습니다. – Schpr

답변

2

창에서 마우스 아래로 이벤트와 마우스 위로 이벤트를 캡처하여 수행 할 수 있습니다. 마우스가 아래로 내려 가면 창 상단을 기록한 다음 마우스가 올라 왔을 때 값이 다른지 테스트합니다. 당신이 조건에 해당하는 경우 할 필요가 무엇이든 수행

var initScr = 0; 
$(window).on({ 
    'mousedown':function(){ 
     initScr = $(this).scrollTop();  
    }, 'mouseup':function(){ 
     if($(this).scrollTop() !== initScr){ 
      console.log('change'); //Your function to go to the nearest section 
     } 
    } 
}); 

JSFiddle

+0

감사합니다. 매력처럼 작동합니다. 사이트가 아니라 탐색기이기 때문에 어떤 이유로 스크롤바에 이벤트를 바인딩 할 수 없다고 생각했습니다. – Schpr

+0

이 해결책은 IE11에서는 작동하지 않으며 스크롤 막대를 클릭 할 때 마우스가 눌려 지거나 마우스 업 이벤트가 발생하지 않습니다. –

관련 문제