3

特定のデバイスでのみ表示されるdivタグを持つことは可能ですか?

デスクトップとiOSデバイスではうまく再生されるがAndroid(特にsamsung S3)では再生されないHTML5フォールバックを備えたビデオページがあります

私はいくつかの調査を行いましたが、その背後にある考えられる理由は、.m3u8がAndroidで完全にサポートされておらず、RTSPにさらに多くの成功レポートがあることです。

Androidデバイスでのみ表示されるビデオ埋め込みコードの下にdivタグを配置したいと思います。

何かのようなもの...

<div id="androids"><a href="rtsp_url">Android user please click here to watch video</a></div>

これは可能ですか?

ところで。私は自分のページでJWPlayerを使用しています。

ありがとう

4

3 に答える 3

2

これを試して:

HTML:

<div id="video"></div>

JavaScript:

var ua = navigator.userAgent.toLowerCase();
var isAndroid = ua.indexOf('android') > -1;

var videoDiv = document.getElementById('video'); 

if(isAndroid) {
  videoDiv.innerHTML = '<a href="rtsp_url">Android user please click here to watch video</a>';
} else {
  //add something else
  videoDiv.innerHTML = '<video>This is HTML 5 video for non-Android users</video>';
}

説明:JavaScriptは、ユーザーがAndroidを使用しているかどうかを確認します。ユーザーがAndroidを使用している場合はに追加<a href="rtsp_url">Android user please click here to watch video</a>され<div id="video">、そうでない場合は通常のHTML5<video>タグが追加されます。

注:<video>This is HTML 5 video for non-Android users</video>ビデオコードを追加する代わりに

于 2012-08-19T16:43:05.713 に答える
0

JavaScriptを使用できる場合は、JavaScriptを使用navigator.userAgentして、それがモバイルブラウザーであるかAndroidデバイスであるかを判断し、適切なHTML要素を挿入することができます。

AndroidUA文字列の例を次に示します。
Mozilla/5.0 (Linux; U; Android 4.0.2; en-us; Galaxy Nexus Build/ICL53F) AppleWebKit/534.30 (KHTML, like Gecko) Version/4.0 Mobile Safari/534.30

于 2012-08-19T15:32:00.247 に答える
0

phpを使用する場合は、これを使用できます:</ p>

function isMobile(){
$useragent_commentsblock=preg_match(’|\(.*?\)|’,$useragent,$matches)>0?$matches[0]:”;

function CheckSubstrs($substrs,$text)
{
foreach($substrs as $substr)
if(false!==strpos($text,$substr))
return true;
return false;
}

$mobile_os_list=array(’Google Wireless Transcoder’,'Windows CE’,'WindowsCE’,'Symbian’,'Android’,'armv6l’,'armv5′,’Mobile’,'CentOS’,'mowser’,'AvantGo’,'Opera Mobi’,'J2ME/MIDP’,'Smartphone’,'Go.Web’,'Palm’,'iPAQ’);

$found_mobile=CheckSubstrs($mobile_os_list,$useragent_commentsblock);

if ($found_mobile) return true;
else return false;

}

Androidの表示のみが必要な場合は、$ mobile_os_listthisarryを編集できます。</p>

于 2012-08-19T17:31:15.683 に答える