Alex Rivera | Logout

How can I use JavaScript to set the zoom level on mobile safari?

Asked 2010-12-21T17:47:49.667
16

How can I use JavaScript to set the zoom level on mobile safari?

Edit
Report

2 Answers

11

[UPDATED] It seems that you want to capture double taps in mobile Safari. You could do that by handling the touchend event, or use an available framework, such as provided in this site.

Take a look at the revised demo: 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
    );
});
answered 2011-03-24T23:46:36.783
0

Try this:

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

Source

answered 2010-12-21T17:51:19.240

Your Answer