I have a Javascript code to determine the client's window width and to show desktop adds or mobile adds. If the window is more than 600px, desktop adds are displayed; else mobile adds are displayed. This is the code:
<script type="text/javascript">
var w = window,
d = document,
e = d.documentElement,
g = d.getElementsByTagName('body')[0],
x = w.innerWidth || e.clientWidth || g.clientWidth,
y = w.innerHeight || e.clientHeight || g.clientHeight;
if (x > 600) {
var uri = "http://impes.tradedoubler.com/imp?type(js)pool(34434)a(54665)" + new String(Math.random()).substring(2, 11);
document.write('<sc' + 'ript type="text/javascript" src="' + uri + '" charset="ISO-8859-1"></sc' + 'ript>');
if (x > 1119) {
document.write('<br />');
} else {
document.write(' ');
}
var uri = "http://impes.tradedoubler.com/imp?type(js)pool(34434)a(4543545)" + new String(Math.random()).substring(2, 11);
document.write('<sc' + 'ript type="text/javascript" src="' + uri + '" charset="ISO-8859-1"></sc' + 'ript>');
} else {
document.write('<sc' + 'ript async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></sc' + 'ript><!-- vesion_movil --><ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-345445454545" data-ad-slot="36543655" data-ad-format="auto"></ins>');
document.write('<sc' + 'ript>(adsbygoogle = window.adsbygoogle || []).push({});</sc' + 'ript>');
}
</script>
This usually works right, but sometimes, when accessing the web site with a mobile (less than 400px window width), I see the desktop version, and the responsive version is broken. Any idea of why can be happening?