Question

如何有条件地将广告（通过广告服务器）展示给移动设备的不同屏幕尺寸？

我不想将显示设置为无隐藏内容，因为这会影响广告展示次数。

我想使用没有jQuery的客户端javascript将广告代码（例如）注入div。

例如，

<div id="adzone"></div>

If width < 768px
   inject ad code for mobile
else
   inject ad code for tablet

我如何实现这个想法？

当器件宽度从小于768px变为更大，然后是768px时，器件旋转会如何处理？

Answer 1

所以，有两件事要讨论：

您可以这样做的一种方法是让JS捕获屏幕大小，然后在询问广告时将其报告给您的服务器。然后，服务器可以决定要投放哪个广告。

您谈论屏幕旋转，并在问题中标记了media-queries。 @media是CSS（而非JS）功能，允许您根据屏幕大小定制外观。您需要确保所投放的广告能够以某种方式纵向和横向展示 - 每次设备更改方向时，您都不希望加载新广告。

完全准确地检测屏幕尺寸可以在设备上以及如何报告。但是，对于JavaScript世界，this SO post涵盖了您需要了解的内容。