XF 1.2 Javascript Help - Ad Tags

[akia]

Can any javascript expert help me out.

In regards to http://xenforo.com/community/threads/1-2-responsive-layout-and-adsense-concerns.53096/. I found this: http://exisweb.net/how-to-use-google-adsense-on-a-responsive-website
I'm trying to get it to work on my site but I can't figure it out.

I've put:

<script type='text/javascript'>
var googletag = googletag || {};
googletag.cmd = googletag.cmd || [];
(function() {
var gads = document.createElement('script');
gads.async = true;
gads.type = 'text/javascript';
var useSSL = 'https:' == document.location.protocol;
gads.src = (useSSL ? 'https:' : 'http:') + 
'//www.googletagservices.com/tag/js/gpt.js';
var node = document.getElementsByTagName('script')[0];
node.parentNode.insertBefore(gads, node);
})();
</script>
<script type='text/javascript'>
$(document).ready(function(){
  var dfpslots=$("#wrapper").find(".adslot").filter(":visible"),
  i=0,
  slot= new Array();
  if (dfpslots.length) {
    googletag.cmd.push(function() {
      $(dfpslots).each(function(){
        slot[i] = googletag.defineSlot('/9999999/'+$(this).attr('data-dfp'), [$(this).width(), $(this).height()], $(this).attr('id')).addService(googletag.pubads());
        i++
      });
      googletag.pubads().enableSingleRequest();
      googletag.enableServices();
      $(dfpslots).each(function(){
          googletag.display($(this).attr('id'));
      });
    });
  }
});
</script>

in the head of my site and I've put:

<div class='adslot visible-desktop' id='div-gpt-ad-1372088736615-1' style='width:970px; height:90px;' data-dfp='ON-F-M-D-Footer'></div>

where I want a test ad to show.

and in my extra I've put:

/* For desktops */
.visible-phone { display: none !important; }
.visible-tablet { display: none !important; }
.hidden-phone { }
.hidden-tablet { }
.hidden-desktop { display: none !important; }
.visible-desktop { display: inherit !important; }
/* Tablets & small desktops only */
@media (min-width: 768px) and (max-width: 979px) {
.hidden-desktop { display: inherit !important; }
.visible-desktop { display: none !important ; }
.visible-tablet { display: inherit !important; }
.hidden-tablet { display: none !important; }
}
/* Phones only */
@media (max-width: 767px) {
.hidden-desktop { display: inherit !important; }
.visible-desktop { display: none !important; }
.visible-phone { display: inherit !important; }
.hidden-phone { display: none !important; }
}

But it just dosn't work. Can anyone work out what I'm doing wrong. Its all just gobbledygook to me.

 

[akia]

Figured it out by myself, Used var dfpslots=$("#headerMover").find(".adslot").filter(":visible"),