Question

我正在基金会3中建立一个响应式网站。

剩下的一个关键点是排行榜广告。我希望有一个广告位可以在桌面和平板电脑上显示排行榜广告，但是手机上的手机专用广告（因为排行榜显然不适合）。

我与Doubleclick（我们的广告供应商）进行了交谈，他们建议在广告加载一个或另一个广告调用时使用内嵌的javascript浏览器嗅探器。

由于Foundation使用Modernizr，我一直在寻找一种方法来利用它来检测要投放的广告。但看看它的文档，我没有看到任何。触摸是唯一的关联，但包括平板电脑;我只想定位手机。

在Modernizr中是否有这样做，或者我应该使用navigator.userAgent？

Answer 1

如果您想使用Modernizr进行简单检查，可以查看Touch支持

if ( Modernizr.touch ) {
   // mobile
} else {
   // desktop
}

当然，这不是最正确的解决方案，因为手机不支持触摸事件。如果您想更全面地检查移动设备，现在正确的方法是检查navigator.userAgent我猜。

Answer 2

走下用户代理的道路可能有点过头了。

我只想定位手机

即使使用Modernizrs功能检测，准确地将手机与平板电脑分开也是一件令人头疼的问题。

如果您的核心问题是显示尺寸正确的广告，为什么不直接使用用户视口来确定广告尺寸？

e.g。

if($(window).width() < desktopAdWidth){
      // do mobile ad stuff..
}

Answer 3

我使用Modernizr.mq（）来评估屏幕尺寸和像素密度的组合。我相信像素密度高于1.0的任何东西都是移动的。

同样根据文档，由于WebOS不报告触摸，因此触摸检测不可靠，我怀疑具有Windows 8触控功能的PC的未来版本的浏览器将开始报告触摸。