如何在1000px以下显示脚本

Question

I have a script but used in same page. like two times. i got error while working when i working on desktop it's work but when i check on below 1000px then it's get error like:- Duplicate Embedded Players Detected.

I think it's worked when i open desktop then show desktop script and when i open mobile then desktop not show mobile script show. please help me how to do that. :-

this is the script i used:-

    <script type="text/javascript" id="vidyard_embed_code_kjashdwejkhsdsheh class="mobile" src="//play.vidyard.com/dskakdehjkwhewhdhshd.js?v=3.1.1&type=lightbox"></script> 

I used for this but it's show syntax error:-

   <script>
                if (jQuery(window).width() < 1000) {
 <script type="text/javascript" id="vidyard_embed_code_kjashdwejkhsdsheh class="mobile" src="//play.vidyard.com/dskakdehjkwhewhdhshd.js?v=3.1.1&type=lightbox"></script> 


     }
                  </script>

Please tell me how to fix that issue. Thanks alot

Answer 1

if (jQuery(window).width() < 1000) {
  <script type="text/javascript" ...snip...></script> 
}

This code is Javascript, so you need to construct a script element in Javascript and append it to the document manually.

var headElem   = document.getElementsByTagName('head')[0];
var scriptElem = document.createElement("script");
scriptElem.type = "text/javascript";

if (jQuery(window).width() < 1000) {
   scriptElem.src = "play.vidyard.com/dskakdehjkwhewhdhshd.js?v=3.1.1&type=lightbox";
   scriptElem.class = "mobile";
}
else {
   scriptElem.src = "desktop.vidyard.com/.......js";
   scriptElem.class = "desktop";
}

headElem.appendChild(scriptElem);