Ros*_*oss 28
这是一个解决方案......
<!-- in head -->
<meta id="viewport" name='viewport'>
<script>
(function(doc) {
var viewport = document.getElementById('viewport');
if ( navigator.userAgent.match(/iPhone/i) || navigator.userAgent.match(/iPod/i)) {
viewport.setAttribute("content", "initial-scale=0.3");
} else if ( navigator.userAgent.match(/iPad/i) ) {
viewport.setAttribute("content", "initial-scale=0.7");
}
}(document));
</script>
Sea*_*ean 10
我用jQuery找到了一个简单的方法!
将其添加到<head>标记:
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<script>if ($(window).width() < 600) { $('meta[name=viewport]').attr('content','initial-scale=0.54, maximum-scale=0.54, user-scalable=no'); }</script>
该<meta>标签设置默认的规模和<script>如果设备屏幕宽度小于600个像素(我想所有的电话设备600像素下)标签重新写入视.
我无法在任何地方找到一个简单的解决方案,所以我想出了这个:)
请注意,meta viewport是以逗号分隔的列表,不应使用分号.
<meta name = "viewport" content = "width = 320,
initial-scale = 2.3, user-scalable = no">
来源: Apple文档中的视口语法和 配置Viewport - Apple文章
(如果我有更多的声望点,我会将其添加为评论)
对于所有移动设备,请尝试这样的事情.
<meta name="viewport" content="width=1024">
<script src="//code.jquery.com/jquery-1.9.1.min.js"></script>
<script type="text/javascript">
if (/iphone|ipod|android|blackberry|opera mini|opera mobi|skyfire|maemo|windows phone|palm|iemobile|symbian|symbianos|fennec/i.test(navigator.userAgent.toLowerCase())) {
$("meta[name='viewport']").attr("content", "width=640");
}
</script>
我不确定你可以只为 iPhone 设置视口，但你可以设置媒体查询，因此我认为只为 iPhone 设置 CSS。
通过仅针对 iPhone (320x480) 或 iPad (1024x768) 的设备宽度设置媒体查询，您可能会实现您想要的效果。
| 归档时间： |
|
| 查看次数： |
32524 次 |
| 最近记录： |