레이블이 touchswipe인 게시물을 표시합니다. 모든 게시물 표시
레이블이 touchswipe인 게시물을 표시합니다. 모든 게시물 표시

2015년 3월 9일 월요일

touchswipe jquery 플러그인 사용시 a태그 스왑 문제

모바일 사이트 제작시 터치 이벤트를 사용하기 위해 jquery 플러그인중 touchswipe 를 사용 할 경우 기본적으로 button, input, select, textarea, a태그 에는 이벤트가 적용되지 않는다.

예로 링크가 걸린 이미지 위에서는 이벤트가 적용 되지 않는다.
HTML의 문제가 아니라 기본 옵션으로 touchswipe 에서 제외하고 있다.

http://labs.rampinteractive.co.uk/touchSwipe/demos/Excluded_children.html


 swipe 제외 영역에 .noSwipe 클래스명을 할당해 주거나 excludedElements 를 재정의 해주면 된다. 전부 삭제할 경우는 아래와 같이 excludedElements 를 사용하면 된다.

$(function() {      
   $("#main").swipe( {
      swipe:function(event, direction, distance, duration, fingerCount, fingerData) {
         $(this).text("You swiped " + direction );  
      },
      threshold:0,
      excludedElements: ""
   });
});