How to zoom on a div on mobile device with javascript?

maybe a clue :

    <meta name="viewport" content="width='+ my开发者_运维百科 div Width+'", initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>

Meta tags are used by the browser when first parsing your page, but are not re-evaluated or accessible after that period.

Theoretically, you could adjust the scale by forwarding the user to a new page on a certain event, with scale set to certain amount and scroll to the location on the page (a hash tag) that you're looking for. That being said, you're going to incur huge loading times on mobile devices unless you can properly pre-cache these pages.

See this question in regards to zooming in a canvas.

Basically, for mobile devices, you're not likely to get functionality as you want it, but you are likely able to mimic it in an intuitive way for the user.

E.g. "user clicks an image"

1) Hash tag change to scroll to the image

window.location.hash = "#image"

2) Adjust size of image to 100% width

$('#my_image').attr('width', '100%')

3) Assign a listener to zoom out when the user interacts again

$(document.body).click( function() { 
  $('#my_image').removeAttr('width', null);
});

Hopefully this will help you work through to your solution.

window.location.hash = "yourDivId";

That will scroll to the position of the div. You can't actually zoom in using JavaScript, but you can use jQuery to animate the size and position of the div, and resize the text, to make it look like you zoomed in. (see http://api.jquery.com/animate/)