我应该将移动浏览器虚拟视口视为系统性错误还是有效的解决方法?

时间:2012-03-06 11:19:04

标签: javascript mobile-safari viewport android-browser

移动设备上的大多数浏览器都在使用与真实显示器不匹配的虚拟视口。这有用的原因有几个,我认为最重要的是:

  • 一个小型设备可能看起来足够大,通常旧学校的网页不会破坏它的桌面屏幕布局。
  • 它用于使HTML渲染引擎渲染比页面当前可见部分更多,从而实现平滑滚动和缩放。

然而,我认为这打破了几个标准化的行为期望。

  • 特别是,页面不知道其可见区域,因此弹出窗口或通知等JS功能不再正常工作。
  • 如果用户将元素移动到视图中,它似乎会打破嵌入式资源(如缩略图,视频对象,无限列表)的按需加载。
  • 它还引入了不规则的行为和布局adpating JS,例如onresize处理程序,adpating页面的布局可以轻松改变页面大小,因此调整视口大小甚至可能重复触发onresize事件。

我是否应该将此视为尚未破解但有一天固定的行为并坚持在每个损坏的页面中使用小的变通方法,或者我应该放弃对onresize,window.innerWidth等的任何期望并返回更多静态布局而不是依赖于视口的想法了吗?

1 个答案:

答案 0 :(得分:0)

我猜你必须权衡开发成本,试图弄清楚所有的怪癖与支持你想要定位的所有设备/屏幕尺寸。我面临着一个类似的问题,它肯定是一个有趣的挑战! Web app on android browser WIDTH issue