Identify whether the device is a PC or cell phone and use a different code for each

In a simple way, you can use this function to detect if it is mobile:

function detectar_mobile() { 
 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)
 ){
    return true;
  }
 else {
    return false;
  }
}

Or use something more professional:

function detectar_mobile() {
  var check = false; //wrapper no check
  (function(a){if(/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|mobile.+firefox|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows ce|xda|xiino/i.test(a)||/1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i.test(a.substr(0,4)))check = true})(navigator.userAgent||navigator.vendor||window.opera);
  return check;
}

EDIT

Solution to Tablets using detectmobilebrowsers.com :

  

Android tablets, iPads, Kindle Fires and Playbooks are not detected by   design. To add support for tablets, add | android | ipad | playbook | silk to   the first regex.

EDIT 2

Another option (possibly the best option) is to use WURFL :

if (WURFL.is_mobile === true && WURFL.form_factor === "Smartphone") {
    // moblie
} else {
    //nao mobile
}

Just a detail about his license:

  

You can use these services free of charge, as long as your website is   publicly available and does not require fees or paid subscription to   access.

Do not try to detect if the device is mobile or desktop through the browser, this is less reliable than checking for age at porn site entry. Chrome mobile itself has an option for Chrome desktop , and it's not even an advanced option. It's in the application's basic menu.

If you're trying to determine whether a device is mobile by the browser's user agent , the only thing you'll guarantee is that new mobile browsers will not receive the mobile experience when they access your site. >

If you try to determine if your device is a cell phone by its capabilities (i.e. detect whether the device supports ringing), you will have bizarre results. My laptop, for example, is touch sensitive. Imagine a website with cell layout rendered on a 15 "screen. That's when I did not plug it into the television ...

The right way to develop pages is to be agnostic about the type of device. Serve layout based on resolution, but so it fits automatically to the window without reloading the page. This is possible with the bootstrap, for example, so I recommend it.

Regarding Javascript, detecting whether the browser is mobile is a worse practice. Just because certain functionality has problems in a mobile model does not mean that it will have the same problems in another model, and vice versa. So, from two to one: either you deprive all users of current mobile browsers of something that would be interesting, or you serve potentially broken functionality for everyone. It is best to determine which javascript functions to serve based on the capabilities of the device, not based on the browser name. There are libraries that go a long way in this. I recommend modernizr .

I found this on the web, tested it and it worked:

<script type="text/javascript">
var userAgent = navigator.userAgent.toLowerCase();
var devices = new Array('nokia','iphone','blackberry','sony','lg',
'htc_tattoo','samsung','symbian','SymbianOS','elaine','palm',
'series60','windows ce','android','obigo','netfront',
'openwave','mobilexplorer','operamini');
var url_redirect = 'http://mobile.seusite.com';
function mobiDetect(userAgent, devices) {
for(var i = 0; i < devices.length; i++) {
if (userAgent.search(devices[i]) > 0) {
return true;
}
}
return false;
}

if (mobiDetect(userAgent, devices)) {
window.location.href = url_redirect;
}
</script>

Where is " link " and just put your website or directory as you like.

Use screen.width to get the width of the screen

var largura = screen.width;

if( largura <= ? ) {  

       //   
}

This information you need to confirm:

• Tablets and phones have widths of 767 down

• Phones have the width of 480 down