当前移动浏览器的最大宽度是多少?

时间:2012-08-14 20:34:31

标签: mobile width detection

我使用http://detectmobilebrowsers.com/中的脚本来检测是否在移动浏览器上查看某个网站。

如果该网站位于移动浏览器上,我会展示一个简单的幻灯片。如果它是常规浏览器,我会展示一个超级幻灯片。我想优化我的图像,使它们在移动幻灯片中尽可能小。我的移动幻灯片显示是响应式的,因此它会缩小以适应任何窗口,但我不想让它最初变得比它绝对要大。

有谁知道当前移动浏览器阵列的最大宽度是多少?或者更确切地说,使用http://detectmobilebrowsers.com/脚本检测到的移动设备的最大宽度?

顺便说一下,在浏览器中加载页面后,我不会问如何检测宽度。

谢谢!

编辑...

我认为你们误解了我的问题。我使用max-width:100%。我的图像可以缩放以适应任何屏幕尺寸。并且,我确定是显示简单的幻灯片还是复杂的幻灯片。这是我的逻辑:

If the user is using a mobile device (based on the device detector)
    show a simple slideshow
Else the use is NOT using a mobile device (based on the device detector)
   If this is a small screen (based on media queries)
       show a simple slideshow
   Else this is a large screen (based on media queries)
       show a complex slideshow
   End If (based on media queries)
End If (based on the device detector)

为什么要使用移动侦测呢?因为即使对于小屏幕我只在小屏幕上显示简单,低文件大小的幻灯片,来自复杂,图像密集,高文件大小的幻灯片的图像仍然下载(http://cloudfour.com/examples/mediaqueries /图像测试/)。我的媒体查询确定要显示的幻灯片显示不会使用户不必下载当前未显示的幻灯片的图像。仅使用它是因为简单的幻灯片在小屏幕上看起来比复杂的更好。使用移动检测屏幕可确保不下载未显示的图像。

为什么我关心当前移动设备的最大宽度,当我的图像设置为100%宽度并缩小到适合任何尺寸?因为900px宽的图像具有比600px宽图像更大的文件大小。如果我知道图像需要的最大宽度是多少,我可以将幻灯片最初保存到该大小,从而节省一些额外的带宽。你们有没有在移动设备上观看过幻灯片?慢!

如果有人能指出我正确的统计数据,我真的很感激。我用Google搜索,但找不到我需要的东西。

1 个答案:

答案 0 :(得分:0)

部署软件后,答案几乎肯定会发生变化。

这还取决于您是指像素还是屏幕分辨率像素(Retina显示器以不同方式定义它们)。

也许最好坚持检测移动浏览器(如果你不喜欢你正在使用的脚本,请参见:   Detecting mobile browsers on the web?) 然后让用户选择更高的rez图像。

或者,你可以尝试检测带宽,这正是你所优化的; “移动”仅仅代表了这一点,并且只与它有适度的相关性。