我有一个简单的页面
<Meta name="viewport" id="extViewportMeta" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no">
在它上面,所有大小都很好地显示在iPhone上.
但是当我在该页面上放置iframe时,iFrame内的所有内容都不可缩放,并且缩放到父页面的大小.
如何只允许在iframe中进行缩放,而不会弄乱我页面的其余部分？
解决方法
不幸的是,你所要求的是不可能的.
首先,在您的“视口”元标记中,您的“内容”属性指定您的网站用户无法放大.这就是’user-scalable = no’的含义.
此外,您的最大尺寸和最小尺寸设置为1,因此即使您删除“user-scalable = no”,缩放也将被禁用,因为您没有缩放范围供用户放大.
因此,为了使用户能够缩放,您必须删除user-scalable = no并设置不同的最小和最大比例值.
其次,由于您的“视口”元标记设置在“父”页面上,所以这些设置也适用于该页面中的任何内容,即iframe. iframe是否具有指定不同设置的不同的Meta’viewport’标签并不重要,因为它存在于父项的设置之下.
