Как изменить рекламную базу javascript по ширине экрана

Я хочу добавить рекламу на свой сайт. Но рекламная компания не предоставляет адаптивного решения.

Все, что я получил, было два источника сценариев для ПК и мобильных устройств.

web

728*90
<script src="http://xxx_728_90&ad_type=banner"></script> 

mobiles

320*50
<script src="http://xxx_320_50&ad_type=banner"></script>

Это будет нормально, если у меня есть две версии для ПК и мобильных устройств, но у меня есть только одна.
Мой вопрос заключается в том, как изменить исходную базу сценария рекламы по размеру экрана.

2 ответа

  1. Необязательно реализовывать скрипт в виде HTML. Вы можете писать свои сценарии!

    Для этого вам понадобится механизм, чтобы решить, работаете ли вы на настольном или мобильном телефоне. Для простоты я буду использовать объект screen, который содержит полезные данные о физическом устройстве. Этот подход немного наивен, рассмотрите возможность использования окна просмотра и прослушивания событий изменения размера, чтобы ответить на изменения размера окна (если библиотека может выдержать повторную загрузку).

    const isDesktop = screen.width > 700;
    const script = document.createElement('script');
    script.src = 'http://xxx_' + (isDesktop ? '728_90' : '320_50') + '&ad_type=banner';
    document.body.appendChild(script);
    
  2. Наконец я нашел решение.

    <script src="http://media.krxd.net/derek/postscribe.js"></script>
    <div class="container">
    <div id="ad"></div>
     <script>
    
     // jQuery used as an example of delaying until load.
      $(function() { 
         if ( $(window).width() > 739) {      
      //Add your javascript for large screens here 
      var str='728_90';
    } 
    else {
      //Add your javascript for small screens here 
      var str='320_100';
    }
        // Build url params and make the ad call
        postscribe('#ad', '<script src=xxx'+str+'&ad_type=banner><\/script>');
      });
    
    </script>
    </div>