Question

<script src="jsv3/jquery.js"></script>
<!--<script src="jsv3/jquery.mobile-1.2.0.min.js"></script>-->

Currently I have insert script for desktop version only because I found that declare two jquery will occur error. Are there any way to check the device type and select different jquery plugin for corresponding device? Thanks

Answer 1

There are many ways to detect the client. Following example involves userAgent to detect the type of client device.

 $(document).ready(function(e) {

        if(navigator.userAgent.match(/Android/i)
             || navigator.userAgent.match(/webOS/i)
             || navigator.userAgent.match(/iPhone/i)
             || navigator.userAgent.match(/iPad/i)
             || navigator.userAgent.match(/iPod/i)
             || navigator.userAgent.match(/BlackBerry/i)
             || navigator.userAgent.match(/Windows Phone/i)) {


          var file=document.createElement("link");
          file.setAttribute("rel", "stylesheet");
          file.setAttribute("type", "text/css");
          file.setAttribute("href", "css/alternate_css_file.css");
          document.getElementsByTagName("head")[0].appendChild(file);

          var file_2= document.createElement("script");
          file_2.setAttribute("type", "text/javascript");
          file_2.setAttribute("src", "js/alternate_js_file.js");
          document.getElementsByTagName("head")[0].appendChild(file_2);

    }

    });

This is a general solution for detecting client devices. You may have to use different CSS for tablets clients like iPad.