@Guirong

viewport need to know

visualviewport vs layoutviewport

  1. layout ViewPort 用于布局，visual ViewPort 指可视窗口
  2. 页面缩放:
    1. layout ViewPort不变，但对应的物理像素变化了
    2. visual ViewPort内的可视像素变化了(window.innerWidth/Height可获取)
    3. layout ViewPort 超出 visual ViewPort 出现滚动条
  3. layout ViewPort 可通过 meta标签指定
  4. devicePixelRatio?http://www.quirksmode.org/blog/archives/2012/07/more_about_devi.html
    1. pc/mobile 不同？ https://code.google.com/p/chromium/issues/detail?id=177836

参考

  1. apple 关于viewport的文档
  2. viewport 探测：http://mqtest.io
  3. viewport 数据：
    1. http://screensiz.es
    2. http://viewportsizes.com
    3. http://mydevice.io/devices/
    4. http://www.canbike.org/CSSpixels/
    5. http://i-skool.co.uk/mobile-development/web-design-for-mobiles-and-tablets-viewport-sizes/
posted at
Top