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
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';
}
}
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.