는 터치 이벤트 작업 CSS3 스포트라이트 효과를 얻으려고 노력하는 것은

Question

내가 여기에 아이 패드에 터치 이벤트 작업이 효과를 얻기 위해 노력하고있어 그것이 무엇이다 jsfiddle http://jsfiddle.net/FwsV4/1/

에 마우스 이벤트와 같아야합니다 것입니다 나는 나를 위해 작동하지 않습니다 http://jsfiddle.net/FwsV4/3/ 시도했습니다.

터치 이벤트와 함께 약간 잃어 버렸고 마우스 클릭/이동을 번역하는 방법에 대해 솔직히 말씀드립니다. 이 효과를 가장 효과적으로 활용하는 방법을 잘 모르겠지만 터치 시작/종료 이벤트를 사용하여 대화 형 요소 아래에 요소를 유지하고 싶습니다.

누구나 올바른 방향으로 나를 가리킬 수 있습니까?

Answer 1

첫 번째 문제는 페이지가 스크롤되지 않도록하기 위해 touchstart에 바인딩해야한다는 것입니다. 당신은 할 수있다 :

$('myElement').htmlElement.bind("touchstart", function(event) { 
    event.preventDefault(); 
    } 
); 

아마 이것에서 또한 협력을 얻는 것이 더 좋다. 전체 페이지를 포함하도록 확대 할 기본 아이폰 OS 등에 의해 이 http://www.sitepen.com/blog/2008/07/10/touching-and-gesturing-on-the-iphone/

두 번째 문제는, 5000px 높이와 폭에 요소를 설정하는 것입니다 :

여기에 터치 이벤트에 대한 좋은 튜토리얼입니다. 이 동작을 조정하거나 줌 동작을 변경하려면 뷰포트 태그를 사용하십시오 (viewport apple docs 참조).

다음 코드도 올바르지 않으며 개체 중 하나가 아닌 부울 값을 반환합니다.

var touch = e.originalEvent.touches[0] || e.originalEvent.changedTouches[0]; 

는이 있어야한다 : [0] e.originalEvent.touches에 관심이하는 TouchMove와

var touch = e.originalEvent.touches[0] ? e.originalEvent.touches[0] : e.originalEvent.changedTouches[0]; 

하지만 (단 하나의 손가락 터치 이벤트 가정이 관심있는).

또한 이러한 방식으로 인라인 j 및 파일 j를 사용하지 않는 것이 좋습니다 (일부 상황에서는 그렇게 할 이유가있을 수 있음). 따라하기 어렵게 만듭니다.

jfiddle을 사용하여 터치 이벤트를 사용하는 것이 좋은 계획인지 잘 모르겠습니다. (잘못된 것일 수도 있습니다.) 정상적인 웹 서버/로컬 파일을 사용하여 개발할 것입니다.