jquery UI 대화 상자의 스크롤과 touchmove 이벤트 충돌 방지.

Question

Safari와 같은 모바일 장치 브라우저에서 사용자가 화면을 드래그하면 전체 웹 사이트가 손가락과 함께 이동합니다. 일반적인 솔루션은 다음과 같습니다.

addEventListener('touchmove', function(e) { e.preventDefault(); }, true); 

이렇게하면 모든 touchmove 이벤트가 방지됩니다. 그러나 모바일 장치의 브라우저에는 스크롤 막대가 없으므로 사용자가 jquery UI의 대화 상자를 스크롤하려면 touchmove 이벤트를 허용해야합니다. 이 명령문은 해당 이벤트를 차단합니다.

addEventListener('touchmove', function(e) { 
if (e.target.id != 'dialog') 
e.preventDefault(); 
return false; 
}, true); 

그런 다음이 문을 추가하여 대화 상자를 스크롤 할 수 있도록합니다. 그러나이 솔루션은 백그라운드가 드래그 가능하고 사용자 손가락과 함께 다시 움직이기 때문에 결함이 있습니다. 이 문제를 해결하는 방법? 감사.

Answer 1

하루 종일 처리하여이 해결책을 찾았습니다. 당신이 아이 패드/아이폰/아이팟에 사파리 모바일에 대화 상자를 스크롤 할 때, 당신은이를 사용할 필요가 :

이

if (/iPhone|iPod|iPad/.test(navigator.userAgent)) { 
      $('iframe').wrap(function() { 
       var $this = $(this); 
       return $('<div />').css({ 
        width: $this.attr('width'), 
        height: $this.attr('height'), 
        overflow: 'auto', 
        '-webkit-overflow-scrolling': 'touch' 
       }); 
      }); 
     }