[모바일웹] 메인메뉴를 터치 슬라이드 방식으로 만들기

네이버(http://m.naver.com) 이나 다음(http://m.daum.net)의 모바일버전을 보면

메인메뉴 영역을 스와이프해서 전체 메뉴를 훑을 수 있게 만들어졌다.

 

 

이 기능을 만들어 보고자 개발자 모드로 확인하였더니 css의 transform, transition 등을 이용해서 만든 것으로 보였다.

그래서 나는 trans관련 css와 함께 스와이프 동작을 인식해야하므로 jquery의 touchstart, touchmove, touchend를 이용해서 만들었다.

참고로 touchstart, touchmove, touchend는 마우스로는 작동이 안되고 핸드폰에서만 작동하는 것을 확인하였다.