All geek questions in one place

My phone does not display the mobile version of my site

I use the following HTML on my website:

<head>
    <link rel="stylesheet" type="text/css" href="css/style.css" media="screen"/>
    <link rel="stylesheet" type="text/css" href="css/mobile.css" media="handheld"/>
</head>

The purpose of this is to switch between the desktop and mobile versions of the site when an appropriate browser is detected. My problem is that my HTC Hero Android browser does not display the mobile version of the site and instead displays only the desktop version. My browser is configured to display the mobile version of the site where possible. What am I doing wrong here?

PS. A mobile site is just a technological demonstration for my coursework, so my browser only needs to browse to show that there is a mobile version of the site (this is my CSS, which is being evaluated).

+3
source share
5

handheld CSS , Android iPhone.

: http://www.rkblog.rk.edu.pl/w/p/optimizing-websites-iphone-and-android/

, - :

<link rel="stylesheet" href="css/style.css" media="screen and (min-device-width: 481px)" type="text/css" />
<link type="text/css" rel="stylesheet" media="only screen and (max-device-width: 480px)" href="css/mobile.css" />
<link rel="stylesheet" href="css/mobile.css" media="handheld" type="text/css" />
+4

, Androids , media="handheld".

iPhone Android ( ): iPhone ( IE), ?

: handheld , Apple iPhone Safari. (Android, , , Mobile Safari). Mobile Safari , , . handheld, -, , , -.

+1

, , , , .

script User-Agent, . .

0

, . Google media="handheld" .

-, , PHP: http://codecanyon.net/item/php-mobile-phone-detection/98397

0

, , - , http://mobiforge.com/developing/story/lightweight-device-detection-php.

The code they give is as follows

<?php

$mobile_browser = '0';

if(preg_match('/(up.browser|up.link|mmp|symbian|smartphone|midp|wap|phone)/i', strtolower($_SERVER['HTTP_USER_AGENT']))) {
    $mobile_browser++;
}

if((strpos(strtolower($_SERVER['HTTP_ACCEPT']),'application/vnd.wap.xhtml+xml')>0) or ((isset($_SERVER['HTTP_X_WAP_PROFILE']) or isset($_SERVER['HTTP_PROFILE'])))) {
    $mobile_browser++;
}    

$mobile_ua = strtolower(substr($_SERVER['HTTP_USER_AGENT'],0,4));
$mobile_agents = array(
    'w3c ','acs-','alav','alca','amoi','audi','avan','benq','bird','blac',
    'blaz','brew','cell','cldc','cmd-','dang','doco','eric','hipt','inno',
    'ipaq','java','jigs','kddi','keji','leno','lg-c','lg-d','lg-g','lge-',
    'maui','maxo','midp','mits','mmef','mobi','mot-','moto','mwbp','nec-',
    'newt','noki','oper','palm','pana','pant','phil','play','port','prox',
    'qwap','sage','sams','sany','sch-','sec-','send','seri','sgh-','shar',
    'sie-','siem','smal','smar','sony','sph-','symb','t-mo','teli','tim-',
    'tosh','tsm-','upg1','upsi','vk-v','voda','wap-','wapa','wapi','wapp',
    'wapr','webc','winw','winw','xda','xda-');

if(in_array($mobile_ua,$mobile_agents)) {
    $mobile_browser++;
}

if (strpos(strtolower($_SERVER['ALL_HTTP']),'OperaMini')>0) {
    $mobile_browser++;
}

if (strpos(strtolower($_SERVER['HTTP_USER_AGENT']),'windows')>0) {
    $mobile_browser=0;
}

if($mobile_browser>0) {
   // do something
}
else {
   // do something else
}   

?>

Then just include your css in the if statement below.

0
source

Source: https://habr.com/ru/post/1773865/

More articles:


All Articles