JavaScript를 사용하여 모바일 Safari에서 확대/축소 수준을 설정하려면 어떻게해야합니까?

Question

JavaScript를 사용하여 모바일 Safari에서 확대/축소 수준을 설정하려면 어떻게해야합니까?

Answer 1

이 시도 :

<meta name="viewport" content="width=device-width; initial-scale=1.0; user-scalable:no;"> 

Source

Answer 2

를 지금까지 내가 아는 한, 당신은 스타일을 변경하여 줌 배율을 텍스트 크기를 변경할 수 있습니다 신체의 '-webkit-텍스트 크기 조정' 요소.

확인 자세한 내용은이 링크 :

http://developer.apple.com/library/safari/#documentation/AppleApplications/Reference/SafariCSSRef/Articles/StandardCSSProperties.html%23//apple_ref/doc/uid/TP30001266--webkit-text-size-adjust

Answer 3

[ 업데이트]] 당신이 모바일 사파리에서 더블 탭을 캡처 할 것으로 보인다. touchend 이벤트를 처리하거나 과 같이 제공되는 프레임 워크를 사용할 수 있습니다.

는 개정 된 데모에서 살펴 보자 : http://jsbin.com/atayo4/20

<p id="tap">double tap to zoom</p> 
    <input id="zoomWidth" type="text" value="400" /> 
    <p id="feedback"></p> 

---

$(document).ready(function(){ 
    $('#tap').doubletap(
    // double tap handler 
    function(e) { 
     $('#feedback').addClass('red').html('double tap! Zoom width: ' + $('#zoomWidth').val()); 

     var zoomWidth = $('#zoomWidth').val(); 

     // zoom with the new width 
     $('meta[name="viewport"]').attr('content', 'width=' + zoomWidth + ', user-scalable:no'); 

     $('#zoomWidth').val(parseInt(zoomWidth, 10) - 25); 
    }, 

    // single tap handler 
    function(e) { 
     $('#feedback').removeClass('red').html('single tap! Zoom width: ' + $('#zoomWidth').val()); 
    }, 

    // double tap delay, default 500 
    400 
    ); 
}); 

Answer 4

나는 아무 소용이 자바 스크립트와 메타 태그의 최소/최대 규모와 폭을 조작했습니다. 코드로 확대/축소 수준을 설정하는 대신 (나는 불가능하다고 생각합니다), 비교적 큰 이미지 위에 작은 보이지 않는 상자를 만들 것입니다. 이렇게하면 사용자가 이미지의 흥미로운 부분을 원래의 두 번 탭하여 확대 (및 축소) 할 수 있습니다.