iOS10 이상 버전의 스케일링 문제에 대한 jQuery의 솔루션에 대한 자세한 설명

iOS10 이상에서 스케일링 문제를 해결하는 방법은 무엇입니까? 이 글은 샘플 코드를 사용하여 jQuery를 기반으로 iOS10 이상의 스케일링 문제를 해결하는 방법을 소개합니다. 매우 훌륭하고 참고할 만한 가치가 있으므로 모든 사람에게 도움이 되기를 바랍니다.

구체적인 코드는 다음과 같습니다.

<script type="text/javascript">
    /*解决ios10以上版本缩放问题 20171102*/
    window.onload=function () { 
    document.addEventListener('touchstart',function (event) { 
      if(event.touches.length>1){ 
        event.preventDefault(); 
      } 
    }) 
    var lastTouchEnd=0; 
    document.addEventListener('touchend',function (event) { 
      var now=(new Date()).getTime(); 
      if(now-lastTouchEnd<=300){ 
        event.preventDefault(); 
      } 
      lastTouchEnd=now; 
    },false) 
  } 
    </script>

추가: ios10에서 사용자의 페이지 확대/축소 금지에 대해 살펴보겠습니다.

ios10 이전에는 메타 설정을 통해 사용자의 페이지 확대/축소를 금지할 수 있습니다:

<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" name="viewport" />

The iOS10 시스템에서는 메타 설정이 유효하지 않습니다.

Safari에서 웹 사이트의 접근성을 향상시키기 위해 웹 사이트의 뷰포트에 user-scalable=no가 설정되어 있어도 사용자는 수동으로 확대/축소할 수 있습니다.

해결책:

window.onload=function () { 
    document.addEventListener('touchstart',function (event) { 
      if(event.touches.length>1){ 
        event.preventDefault(); 
      } 
    }) 
    var lastTouchEnd=0; 
    document.addEventListener('touchend',function (event) { 
      var now=(new Date()).getTime(); 
      if(now-lastTouchEnd<=300){ 
        event.preventDefault(); 
      } 
      lastTouchEnd=now; 
    },false) 
  }

를 방지하기 위해 이벤트 수신 자세한 설명

위 내용은 iOS10 이상 버전의 스케일링 문제에 대한 jQuery의 솔루션에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!