我有一个HTML元素,正好是1000px宽和850px高(它实际上是一个在画布标签上包含HTML5游戏的iFrame,但我希望这无关紧要).
我想要在平板电脑上显示的元素,以便视口缩放以始终显示整个元素,仅此而已.因此,当平板电脑处于横向模式时,您会看到任意一侧的空白区域; 在纵向模式下,下方(和上方？)会有空白区域.
在iPad2上进行测试时,纵向模式似乎开箱即用,视口自动将元素放在顶部并进行缩放以准确显示整个图像; 但在横向模式下,它正在做同样的事情并切断底部.
我已经尝试了viewport元标记的各种组合,例如<meta name="viewport" content="height=850"/>,但似乎无法让它始终如一地工作.
使用jQuery根据窗口大小的变化调整大小的解决方案将受到欢迎.
viewport ×1