Google Maps AdSense 库 - 自适应广告
Google Maps AdSense Library - Responsive Ads
我有一个针对移动设备和台式机的响应式 Web 地图站点。
我正在使用 Google Maps AdSense Library 投放广告,但它没有任何内置的响应式解决方案来根据屏幕分辨率投放不同尺寸的广告单元。
有没有人想出一个优雅的解决方案来使 AdSense 库响应迅速?至少基于网站首次加载时的浏览器 window 大小。
使用jQuery的一个非常简单的解决方案:
var adFormat = google.maps.adsense.AdFormat.BANNER;
if ($(window).width() < 480) adFormat = google.maps.adsense.AdFormat.HALF_BANNER;
try { // Needed as AbBlocker will cause site to fail
var adUnitDiv = document.createElement('div');
var adUnitOptions = {
format: adFormat,
position: google.maps.ControlPosition.BOTTOM_CENTER,
map: map,
visible: true,
publisherId: 'ca-pub-XXXXXXXXXXX'
}
var adUnit = new google.maps.adsense.AdUnit(adUnitDiv, adUnitOptions);
}
catch (error) {
// Do nothing, error probably caused by an ad blocker.
}
我有一个针对移动设备和台式机的响应式 Web 地图站点。
我正在使用 Google Maps AdSense Library 投放广告,但它没有任何内置的响应式解决方案来根据屏幕分辨率投放不同尺寸的广告单元。
有没有人想出一个优雅的解决方案来使 AdSense 库响应迅速?至少基于网站首次加载时的浏览器 window 大小。
使用jQuery的一个非常简单的解决方案:
var adFormat = google.maps.adsense.AdFormat.BANNER;
if ($(window).width() < 480) adFormat = google.maps.adsense.AdFormat.HALF_BANNER;
try { // Needed as AbBlocker will cause site to fail
var adUnitDiv = document.createElement('div');
var adUnitOptions = {
format: adFormat,
position: google.maps.ControlPosition.BOTTOM_CENTER,
map: map,
visible: true,
publisherId: 'ca-pub-XXXXXXXXXXX'
}
var adUnit = new google.maps.adsense.AdUnit(adUnitDiv, adUnitOptions);
}
catch (error) {
// Do nothing, error probably caused by an ad blocker.
}