用手机/平板电脑上的图像替换HTML视频

时间:2015-02-23 20:24:13

标签: php mobile html5-video

我的主页上有一个循环播放的自动播放视频。从手机或平板电脑访问我的网站时,我想将其替换为静止图像。我尝试了很多事情,但我仍然遇到问题。

使用我目前使用的PHP,它可以在iPad上运行,但不适用于我的iPhone。

<?php
$tablet_browser = 0;
$mobile_browser = 0;

if (preg_match('/(tablet|ipad|playbook)|(android(?!.*(mobi|opera mini)))/i', strtolower($_SERVER['HTTP_USER_AGENT']))) {
    $tablet_browser++;
}

if (preg_match('/(up.browser|up.link|mmp|symbian|smartphone|midp|wap|phone|android|iemobile)/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','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['HTTP_USER_AGENT']),'opera mini') > 0) {
    $mobile_browser++;
    //Check for tablets on opera mini alternative headers
    $stock_ua = strtolower(isset($_SERVER['HTTP_X_OPERAMINI_PHONE_UA'])?$_SERVER['HTTP_X_OPERAMINI_PHONE_UA']:(isset($_SERVER['HTTP_DEVICE_STOCK_UA'])?$_SERVER['HTTP_DEVICE_STOCK_UA']:''));
    if (preg_match('/(tablet|ipad|playbook)|(android(?!.*mobile))/i', $stock_ua)) {
      $tablet_browser++;
    }
}

if ($tablet_browser > 0) {
   //tablet
   echo "
   <a id='button' style='background-position: center 6px!important; height: 80px;'></a>
   <img id='videoImage' src='videos/STILL-IMAGE.png'>";
}
else if ($mobile_browser > 0) {
    //phone
   echo "
   <a id='button' style='background-position: center 6px!important; height: 80px;'></a>
   <img id='videoImage' src='videos/STILL-IMAGE.png'>";
}
else {
   //everything else
   echo "
    <a id='button' style='background-position: center center; height: 69px;'></a>
    <video autoplay loop id='video'>
    <source src='videos/VIDEO.mp4' type='video/mp4'>
    </video>";
}   

?>

有谁知道为什么这不起作用或者我可以使用不同的方法来解决这个问题?

0 个答案:

没有答案