问题标签 [viewport]

我正在寻找一种无需购买实际硬件即可测试我的移动设备网页布局的方法。我主要对 iPhone 和 iPad 的测试感兴趣。我拥有一部 iPhone，因此可以在那里进行适当的测试。但我无法确定它在 iPad 上的样子。无论哪种方式：最好在我的 Mac 上检查视觉输出，因为我正在构建它以提高生产力。

testiphone.com 应该模拟一个网站的外观，但是在渲染布局比例方面存在差异：在我的 iPhone 硬件上，内容的宽度被缩放以适应屏幕的左右边距。在 testiphone.com 模拟器中，内容根本没有缩放。

那么是否存在一种可以一致地测试视觉布局的方法？

（我不反对订阅 Developer SDK，但如果有更快、更简单的方法来让视口和缩放保持一致，我会更喜欢它！）

我有一个网页出现在 ipad 上。我为视口添加了这个元数据：

它在纵向上工作得很好，然后当 ipad 进入横向模式时它也工作得很好。问题是当我从横向返回纵向时，页面过度拉伸，这意味着页面的某些部分在纵向模式下会离开屏幕。我必须双击屏幕才能恢复正常视图。

然后我尝试了：

但是在纵向模式下它不够宽，并且图标/文本应该只有一行时会换行到 2 行。一切都变得混乱起来。有什么建议么？

我有两个班级：

1) onePlayerGame.cs 这个类定义了屏幕上的4个视口

2）game1.cs这个类是一个简单的游戏

如何让 game1 在其中一个视口上运行？两个课程都运行良好......但我不确定如何让游戏“出现”在其中一个视口上......

哦...我正在做一个 2D 项目

求帮助~~~

我和 Sencha 一起去 MVC 路线。我有一个像 twitter 示例一样初始化的视口面板：

新代码：

我希望能够根据当前在视口中呈现的面板类型有条件地应用停靠项（工具栏）。EG：一个用于登录、主屏幕、详细信息屏幕等。

我试过使用 Ext.apply(App.Viewport, { dockedItems: [App.LoginBar]}); 但这不起作用。目前它可以将工具栏添加到当前渲染的面板并将其设置为全屏，但不幸的是，转换和事情的行为很奇怪，因为结构是

有人有建议吗？

我希望在单个 Wordpress 主题中获得桌面和移动功能。

有几种可用的解决方案使用 post/get 方法将屏幕大小发送到 php。例如：http ://www.openjs.com/articles/ajax_xmlhttp_using_post.php

现在我的问题是如何在 Wordpress 中实现这一点。作为参考，PHP 的结构如下：

索引.php：

身体

所以问题是：

在从 index.php 调用 get_header() 之前，有什么方法可以将屏幕高度/宽度/视口转换为 PHP 变量？

有一些不错的 WP 插件可用于检测移动设备。我的问题是他们主要使用几乎不可靠的用户代理数据。我希望我的设计根据用户视口而改变。为此，我还需要在主题中操作 Wordpress PHP 调用。

不守规矩网站的网址：http ://chrism.se

上线后我们发现如果视口对于内容来说太小，以至于需要滚动，背景图像（body-tag，repeat-x）不会超出初始视图，但我不能为我的一生弄清楚为什么以及如何解决它。需要记住的一点是，我没有自己编写网站代码，因为我不是那么精通 Javascript，而且设计师想要一些 swooshy 效果。我的高级同事当然可以找到补救措施，但不幸的是他不在，我想结束这件事。

html 和 css 的状态与我发现该问题时的状态相同，但我尝试了在类似问题上看到的建议，主要围绕 min-width。我真的不明白背景之间的区别仅与视口一样宽吗？我的问题？

全视图 = i.imgur.com/6aDpN.jpg

问题 = i.imgur.com/X6JVp.jpg

我有一个网站需要在 iphone 上使用 0.3 的视口值，而在 ipad 上使用 0.7 值。

有没有办法只为 iphone 或 ipad 设置视口？

我的客户要求我将当前桌面浏览器网站的大小减少 30%。

是否有像移动浏览器上的视口元标记一样的 CSS 或元标记？

这个特定的 Mobile Safari（似乎不可能但未记录）问题让我今天坚持了很长时间，当我想通了时，我正要在这里发布一个关于它的问题。

问题：虽然我设置<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; minimum-scale=1.0; user-scalable=no;"/>了我的 iPad 网络应用程序仍然允许手动缩放（在浏览器中捏合）。-- 但只在我的 iPad 上，而不是在我的 iPhone 上。

此外，我会在纵向模式和横向模式之间旋转设备，以检查特定的方向模式 CSS 代码，这会产生奇怪的结果：

• 从横向旋转到纵向没有问题，所有东西的大小和位置都很合理。
• 之后，从纵向旋转回横向并且..视口保持与纵向模式一样宽，即。它被放大（缩放）。我必须手动缩小才能回到完整的图片/视口。这应该是不可能的。

我在一个宽度为 1200 像素的网页上环绕了我的内容。wrap div 使用这个 css 在我的页面中间居中，position:absolute; top:0px; left:50%; margin-left:-600px; width:1200px; height:auto; 如果浏览器视口宽度小于 1200px，我需要使用 jQuery 将左侧值从 50% 更改为 0px。例如，现在在 ipod 上，因为环绕居中，我左侧的内容被切断，无法滚动到侧面。先感谢您。