Display point closing tags

I configure javascript to display the ad network banner code for 728x90 on screens larger than 767. If the screen width is less, then only the banner code 300x250 will be displayed. When I add the code below, it doesn’t show anything on the website and on the mobile phone, just to an empty place. If that helps, I work inside wordpress.

<div class="container">Υ™ <script> window.onresize = function(){ var head = document.getElementsByTagName('head')[0]; var script = document.createElement('script'); if ( $(window).width() <= 767) { e9 = new Object(); e9.size = "320x50"; script.src = "http://tags.expo9.exponential.com/tags/ProwrestlingcomMobile/320x50/tags.js"; head.appendChild(script); }else { e9 = new Object(); e9.size = "728x90"; script.src = "http://tags.expo9.exponential.com/tags/ProWrestlingcom/ROS/tags.js"; head.appendChild(script); } } </script> </div> 

Original ad code 728x90:

 <script type="text/javascript"><!-- e9 = new Object(); e9.size = "728x90,970x250"; //--></script> <script type="text/javascript" src="http://tags.expo9.exponential.com/tags/ProWrestlingcom/ROS/tags.js"></script> 

Original ad code 300x250:

 <script type="text/javascript"><!-- e9 = new Object(); e9.size = "320x50"; //--></script> <script type="text/javascript" src="http://tags.expo9.exponential.com/tags/ProwrestlingcomMobile/320x50/tags.js"></script> 
+5
source share
2 answers

Two problems with this code:

1) window.onresize will be called several times when the window is resized, as a result of which the script tag is added several times

2) window.onresize will be called only when resizing, and not when loading. window.onload will be called once by adding a script. So maybe just change window.onresize => window.onload

+2
source

You can use <iframe > elements and css media queries to switch two <iframe> elements from src to html containing <script> for 728x50 , 300x250 respectively

style.css

 @media (max-width: 767px) { iframe[src="728.html"] { display: none; } } @media (min-width: 767px) { iframe[src="300.html"] { display: none; } } 

index.html

 <!DOCTYPE html> <html> <head> <link rel="stylesheet" href="style.css"> </head> <body> <iframe src="728.html" width="728px" height="90px" style="border:none;" scrolling="no"></iframe> <iframe src="300.html" width="300px" height="250px" style="border:none;" scrolling="no"></iframe> </body> </html> 

300.html

 <!DOCTYPE html> <html> <head> </head> <body style="background:green;width:320px;height:250px;"> <script type="text/javascript"><!-- e9 = new Object(); e9.size = "320x50"; //--></script> <script type="text/javascript" src="http://tags.expo9.exponential.com/tags/ProwrestlingcomMobile/320x50/tags.js"></script> </body> </html> 

728.html

 <!DOCTYPE html> <html> <head> </head> <body style="background:blue;width:728px;height:50px;"> <script type="text/javascript"><!-- e9 = new Object(); e9.size = "728x90,970x250"; //--></script> <script type="text/javascript" src="http://tags.expo9.exponential.com/tags/ProWrestlingcom/ROS/tags.js"></script> </body> </html> 

plnkr http://plnkr.co/edit/L7yWvl9YGLpBtIKWT87x?p=preview

0
source

All Articles