如何使用javascript在移动设备上放大div？

Question

也许是一个线索：

    <meta name="viewport" content="width='+ my div Width+'", initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>

Answer 1

首次解析您的网页时，浏览器会使用元标记，但在此期间后不会对其进行重新评估或访问。

理论上，您可以通过将用户转发到特定事件的新页面来调整比例，将比例设置为特定数量并滚动到您要查找的页面上的位置（哈希标记）。话虽如此，除非您可以正确预先缓存这些页面，否则您将在移动设备上产生大量加载时间。

有关放大画布的信息，请参阅this question。

基本上，对于移动设备，您可能不会像想要那样获得功能，但您可能会以直观的方式为用户模仿它。

E.g。 “用户点击图片”

1）哈希标签更改以滚动到图像

window.location.hash = "#image"

2）将图像尺寸调整为100％宽度

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

3）指定侦听器在用户再次交互时缩小

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

希望这有助于您完成解决方案。

Answer 2

window.location.hash = "yourDivId";

这将滚动到div的位置。 您实际上无法使用JavaScript进行放大，但您可以使用jQuery为div的大小和位置设置动画，并调整文本大小，使其看起来像放大。 （见http://api.jquery.com/animate/）