2012-01-11 3 views
1

일부 스크롤 가능 요소를 드래그 할 수 없도록 만드는 데 문제가 있습니다.스크롤 가능한 요소를 드래그 할 수있게 만드는 방법은 무엇입니까?

jquery UI를 사용하고 있지만 기본적으로 드래그 이벤트를 방해하지 않도록 스크롤바가 필요합니다.

이는 예를 들어 바이올린 JS 참조 : 파이어 폭스에서 http://jsfiddle.net/eCbSp/

가 스크롤바를 아래로 끌어 커서가 마우스로 스크롤 시도 후 상자에 부착된다/즉 크롬에서, 이동 상자를 야기한다.

내가하려는 일이 가능하면 누구에게 알리십니까?

감사

+0

가능한 중복 (HTTP) = 그래도 작동해야이 ... 잘 작동 작동 jsfiddle하지만 그것을 크로스 브라우저를 시도 didnt는 희망 /stackoverflow.com/questions/2307161/jquery-drag-scrolling-overflow-issue) –

+0

도움이 될만한 정보가 있습니다. [http://stackoverflow.com/questions/3300765/how-to-disable-draggable-div-when-scroll-bar-is-focused-on-in-jquery][1] [1] : http://stackoverflow.com/questions/3300765/how-to-disable-draggable-div-when-scroll-bar-is-focused-on-in-jquery – T23

+0

문제는 크롬이 스크롤 막대에 마우스를 올리십시오. 참조 : http://code.google.com/p/chromium/issues/detail?id=31264 – Yoshi

답변

2

내가 한 일은 곳은 스크롤 사업부의 내부 사업부이었고, 부모가 폭의 98 %로 그 폭을 설정합니다. 나는 그것을 핸들로 사용할 수 있도록 만들었습니다. 즉, 사용자가 해당 요소를 클릭하면 실제로 드래그 가능한 요소가 움직이게됩니다./: 그것은

<div class="valign_outer container"> 
    <div class="myhandle" style="width:98%; height:100%;"> 
    <div class="valign_inner"> 
     <p>How much content is in here?</p> 
     <p>Lots</p> 
     <p>And Lots</p> 
     <p>And Lots</p> 
     <p>And Lots</p> 
     <p>And Lots</p> 
     <p>And Lots</p> 
     <p>And Lots</p> 
     <p>And Lots</p> 
     <p>And Lots</p> 
     <p>And Lots</p> 
     <p>And Lots</p> 
     <p>And Lots</p> 
     <p>And Lots</p> 
     <p>And Lots</p> 
     <p>I am going to be bigger than min height!</p> 
    </div> 
</div> 


var dragOpts = { 
    handle: '.myhandle' 

} 
$('.container').draggable(dragOpts); 

Here is a sample of it working

[JQuery와 드래그/스크롤/오버 플로우 문제]의
관련 문제