How to know site open in mobile or PC browser?

Question

I am developing site in php with responsive HTML. Now, I want to hide menu if user open that site in mobile browser (iOS and Android).

Then how i can verify in HTML or jQuery so i can hide menu. I tried to find but not get any proper solution.

Let me know if any one have.

Thanks

Answer 1

with CSS you can use @media-queries like the following:

@media screen and (max-width: 1199px) {
 .your-navigation{
   display:none;
 }
}

or you use jQuery like the following:

if($(window).width()<=1199){
  $(".your-navigation").hide();
}

but i would go with media queries, because its a more elegant and more easy to change way!

so actually you are not checking if its a mobile browser or desktop, but its totally okay, to check the width of the browser... i think, thats more what you want...

** edit **

after some thoughts i just wanna say, that it is possible to get the current browser by using javascript, but i wouldn't recommend that to you, because its not rubust and you will have a lot of pain with getting all browsers and so on... as i already said, go with the width! :)

(here is a link with an approach)

** edit 2 **

regarding your comment:

check this link out, it should be exactly what you want

here the code, thanks to feeela

/**
 * Determine the mobile operating system.
 * This function either returns 'iOS', 'Android' or 'unknown'
 *
 * @returns {String}
 */
function getMobileOperatingSystem() {
  var userAgent = navigator.userAgent || navigator.vendor || window.opera;

  if( userAgent.match( /iPad/i ) || userAgent.match( /iPhone/i ) || userAgent.match( /iPod/i ) )
  {
    return 'iOS';

  }
  else if( userAgent.match( /Android/i ) )
  {

    return 'Android';
  }
  else
  {
    return 'unknown';
  }
}