Rock The Click

Media, Advertising, Tech and Mumbo Jumbo

Hiding things from showing on mobile screens

Posted in Tech How To
at 2015.12.01
With 0 Comments

How to hide content on mobile devices. This will work for PHP, Javascript or simple HTML code.

Add the following code into your <head> or style.css

<style type=”text/css”>
.mobileHide { display: inline;}
/* Mobile Portrait and Landscape */
@media only screen
and (min-device-width : 320px)
and (max-device-width : 480px){ .mobileHide { display: none;}}
</style>

Now go to your code, image or javascript that you would like to hide for end-users from mobile devices.

<div class=”mobileShow”>
Enter code in here that you do not want to appear on mobile resolutions
</div>

Want to do it in PHP with user-agent detection?

 

<?php $iphone = strpos($_SERVER[‘HTTP_USER_AGENT’],”iPhone”);
$android = strpos($_SERVER[‘HTTP_USER_AGENT’],”Android”);
$palmpre = strpos($_SERVER[‘HTTP_USER_AGENT’],”webOS”);
$berry = strpos($_SERVER[‘HTTP_USER_AGENT’],”BlackBerry”);
$ipod = strpos($_SERVER[‘HTTP_USER_AGENT’],”iPod”);
$mobile = strpos($_SERVER[‘HTTP_USER_AGENT’],”Mobile”);
$symb = strpos($_SERVER[‘HTTP_USER_AGENT’],”Symbian”);
$operam = strpos($_SERVER[‘HTTP_USER_AGENT’],”Opera M”);
$htc = strpos($_SERVER[‘HTTP_USER_AGENT’],”HTC_”);
$winphone = strpos($_SERVER[‘HTTP_USER_AGENT’],”WindowsPhone”);
$wp7 = strpos($_SERVER[‘HTTP_USER_AGENT’],”WP7″);
$wp8 = strpos($_SERVER[‘HTTP_USER_AGENT’],”WP8″);

$isMobile = false;

if ($iphone || $android || $palmpre || $ipod || $berry || $mobile || $htc || $winphone || $wp7 || $wp8== true)
{
$isMobile = true;
Show on mobile
?>
Show on desktop/laptop
<?php }else{ ?>

<?php }?>

Leave a Reply