2012-06-01 5 views
0

2 개 div, 왼쪽 및 오른쪽 div가 있고 왼쪽 div에는 트리 뷰가 있고 오른쪽 div에는 격자가 있습니다. 그리드에서 트리 뷰로 항목을 드래그 할 수 있습니다. 트리 뷰에는 노드 위로 마우스를 가져 가면 트리 뷰를 확장하는 코드가 있습니다.스크롤 가능한 div에 드래그 앤 드롭

트리를 탐색 할 때 트리 뷰의 크기로 인해 스크롤바가 나타납니다. 완전히 확장 된 트리 뷰에 항목을 드래그하면 그 아래쪽으로 끌 수 있습니다. 문제는 스크롤 막대 doeesnt 스크롤을 드래그하여 스크롤 막대를 사용하여 일반적으로 볼 필요가있는 항목을 표시합니다. 트리 뷰에서 드래그하여 해당 항목을 볼 수 있습니다.

왼쪽 사업부는 다음과 같습니다 -

{ 
    display: inline-block; 
    width: 350px; 
    height: 800px; 
    float: left; 
    overflow: auto; 
} 

어떤 조언은 좋은 것입니다.

답변

0

사용자는 마우스 휠을 사용하여 계속 스크롤 할 수 있습니다. 사람이 위젯을 디자인 할 때 트리 위나 아래에 몇 픽셀 높이의 핫스팟 (div가 자바 스크립트로 연결된 mousemove 이벤트)을 추가하는 것이 좋습니다. mousemove 이벤트에서 트리를 위 또는 아래로 스크롤하여 핫스팟 위에 마우스를 올리면 트리를 스크롤 할 수 있습니다.

드래그 한 객체가 mousemove 이벤트를 가로채는 경우 (상당히 있음) 객체가 트리 위 또는 아래로 드래그되고 있는지 확인하는 코드를 추가해야합니다 속도). 이 코드는 마우스가있는 곳 (신체 요소 일 가능성이 있음)을 알 수있는 요소에 있어야합니다.