2011-11-26 2 views
0

오른쪽에 슬라이딩 패널이있는 html 페이지가 있습니다. 이 패널의 너비는 200 픽셀이고 위치는 고정되어 있으며 위치는 처음에 오른쪽 : -100 픽셀 (클라이언트 영역의 중간 부분)으로 설정됩니다. Overflow-x는 본문 html (css)에 대해 숨김으로 설정되고 패널은 마우스 오버 이벤트 및 드롭 이벤트를 허용합니다. 마우스를 올리면 패널이 오른쪽으로 슬라이드됩니다.드롭 이벤트에서도 가로 스크롤을 완전히 비활성화합니다.

이 패널에서 드래그 가능한 요소를 드래그하면 패널이 올바르게 왼쪽으로 슬라이드되지만 원치 않는 동작 인 창이 오른쪽으로 스크롤되기 시작합니다.

또한 여기에 설명 된대로 자바 스크립트 솔루션을 시도했습니다. Disable horizontal scroll with JavaScript 하지만 clientArea가 깜박이기 시작하기 때문에 잘못된 해결 방법입니다.

가로 스크롤을 완전히 비활성화하는 가장 좋은 방법은 무엇입니까? 크로스 브라우저 솔루션 일 가능성이 있습니다.

감사

는 업데이트 :

그것은 마우스 (나는 JQuery와 - UI를 사용하고 있습니다) 문제지만, 드래그 요소의 도우미 개체를 일으키는 슬라이딩 패널을 고정됩니다 아니에요되는 드래그하는 동안 왼쪽 위 위치. helper 객체를 div 200x100px로 상상해보십시오. 창 영역의 가장 오른쪽 부분으로 드래그하면 헬퍼를 자르지 않고 창을 스크롤하는 대신 오른쪽으로 스크롤하는 문제가 발생합니다. 드래그 작업 중에 도우미의 오른쪽 위 모서리에 마우스를 고정 시켜서 일종의 관리를하지만, 윈도우의 수평 스크롤을 완전히 비활성화 할 수있는 방법이 있는지 궁금합니다. 헬퍼 객체는 페이지 흐름에서 완전히 분리되었다고 가정합니다. (위치 : css에서 절대 위치를 사용하는 것처럼) 분명히 그렇지 않습니다.

+0

신체에 특정 너비가 지정 되었습니까? –

답변

0

나는 초기 요구 사항을 변경하여 페이지 디자인을 변경했습니다.

-1

패널을 오른쪽으로 배치하지 않으면 -100px이지만 너비는 100px로하고 오른쪽으로 배치하십시오 : 0px?

그런 다음 마우스 오버시 폭을 200px로 지정하십시오. 여전히 슬라이드처럼 느껴집니다. 패널의 내용이 너비를 변경할 수 있는지 여부는 모르지만 패널에 오버플로를 숨길 수는 있습니다.

+0

잘 해결 방법이 될 수 있지만 주요 문제를 해결하지는 못합니다. 문제를 해결하는 또 다른 방법 일뿐입니다. –

+0

downvote는 무엇인가요? 이것은 나의보기이다 : http://jsfiddle.net/timing/ZAuaw/ – timing

+0

그것은 당신을 downvoted 저 아니다; 어쨌든 길어진 줄은 당신의 해결 방법을 감싸고, 나는 그것이 필요한 것이 아닙니다. http://jsfiddle.net/ZAuaw/3/ 그럼에도 불구하고, 시간 내 주셔서 감사합니다. –

관련 문제