Question

如何使用JavaScript在移动版Safari上设置缩放级别？

Answer 1

[更新]您似乎想在移动版Safari中捕获双击。您可以通过处理touchend事件或使用可用框架（例如this site中提供的内容）来实现此目的。

  <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 2

据我所知，您可以通过更改body元素的'-webkit-text-size-adjust'样式来更改文本大小的缩放系数。

查看此链接以获取更多信息：

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

我尝试用JavaScript操纵元标记中的最小/最大比例和宽度无济于事。而不是试图用代码设置缩放级别（我认为这是不可能的），我将在我相对较大的图像上创建小的隐形框。这将允许用户通过原生双击图像的有趣部分来放大（和缩小）。

Answer 4

试试这个：

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

Source

如何使用JavaScript在移动Safari上设置缩放级别？

4 个答案: