마우스 드래그 테스트

전체 페이지 드래그 테스트 지원이 있는 전문 마우스 드래그 감지 도구

트랙패드 궤적 표시

100%

트랙패드 제스처 색상 설명

1손가락 가벼운 터치 (점선)
1손가락 압력 (실선)

캔버스에서 터치 궤적 그리기

궤적 포인트: 0

스트로크 수: 0

현재 스트로크: 0
줌: 100%
드래그: (0, 0)
준비됨
1손가락 가벼운 터치
0
1손가락 압력
0

사용 팁:

트랙패드에서 손가락을 움직이면 시스템이 자동으로 궤적을 그립니다. 가벼운 터치 이동은 밝은 궤적, 압력 이동은 어두운 궤적을 표시합니다.

파란색 점선 프레임이 그리기 가능한 영역입니다. 줌이나 드래그 후에는 이 영역 내에서 그려주세요.

사용자가 마우스의 드래그 기능과 슬라이딩 인식을 빠르게 진단하는 데 도움이 되는 전문 마우스 드래그 감지 도구입니다. 전체 페이지 감지를 통해 마우스 드래그, 슬라이딩 궤적, 클릭 및 드래그 등을 감지할 수 있으며, 실시간 상태 모니터링과 기록 추적을 지원하여 하드웨어 감지 및 사무 장비 유지보수의 필수 도구입니다.
• 전체 페이지 드래그 감지: 마우스 드래그, 슬라이딩 궤적, 클릭 및 드래그 지원 • 실시간 궤적 그리기: 마우스 궤적과 드래그 상태의 직관적 표시 • 스마트 상태 모니터링: 드래그 트리거 상태와 감지 정보의 실시간 표시 • 기록 추적: 모든 드래그 작업과 타임스탬프의 상세 기록 • 다국어 지원: 10개 언어 인터페이스 지원 • 반응형 디자인: 다양한 화면 크기와 마우스 장치에 적응
1. 페이지에 들어간 후, 전체 페이지가 감지 영역입니다 2. 페이지에서 다양한 마우스 드래그 작업 수행 3. 드래그 기능 테스트: 마우스 왼쪽 버튼을 누르고 드래그 4. 슬라이딩 궤적 테스트: 마우스를 움직여 궤적 그리기 관찰 5. 클릭 및 드래그 테스트: 다양한 요소를 클릭하고 드래그 6. 궤적 그리기 영역의 실시간 피드백 관찰 7. 상세한 작업 정보를 위해 기록 보기 8. 재설정 버튼을 클릭하여 기록 지우기
Mouse Event API를 기반으로 개발되어 mousedown, mousemove, mouseup, drag 이벤트를 수신하여 드래그 감지를 구현합니다. Canvas 2D API를 사용하여 마우스 궤적을 그리며, Vue 반응형 시스템을 적용하여 실시간 데이터 업데이트를 수행하고, 이벤트 수식어를 결합하여 성능을 최적화하여 직관적인 시각적 피드백을 제공합니다.
💻 사무 장비 일상 유지보수
Q: 왜 전체 페이지 감지를 사용하나요? A: 마우스 드래그는 큰 작업 공간이 필요하며, 전체 페이지 감지는 사용자의 "드래그 범위 제한"에 대한 우려를 피합니다 Q: 어떤 작업이 지원되나요? A: 기본 드래그(클릭 및 드래그)와 고급 작업(슬라이딩 궤적, 다중 요소 드래그)을 지원합니다 Q: 기록은 얼마나 오래 저장할 수 있나요? A: 페이지 새로고침 또는 수동 재설정까지 지속적으로 저장됩니다 Q: 어떤 장치가 호환되나요? A: 모든 표준 마우스 장치와 최신 브라우저를 지원합니다