2012-05-23 20 views
15

を働いていません。動画の終了時に別のURLにリダイレクトする必要があります。HTML5ビデオ:別のWebページにリダイレクトし、その後フルスクリーン再生する - 私が開いたときにフルスクリーンを自動再生している単一の3GPP(またはMP4)ビデオとAndroidの4スマートフォン向けHTML5のページをデザインしてい

いくつかのグーグルでは、自動再生がこれ以上のAndroid 4上で許可されていることを私に言っていないので、私は、ユーザーがビデオを開始するためにクリックしているポスターの画像を表示することを選びました。 が続い:

  1. フルスクリーンモードが起動される
  2. ビデオは自動的に (実際にポスター画像上のユーザがクリックによって開始された)
  3. ときの映像仕上げAndroidが
  4. フルスクリーンを終了し、最終的にリダイレクトする必要があります再生するを開始する必要がありますユーザーをページに追加する

2と3が動作していない:フルスクリーンのユーザーを呼び出した後、別の画面が黒く、ユーザーである(ビデオを開始するには、ビデオが終了したときexitfullscreenが機能しない「をクリックし、」んに「戻る」キーを押す必要がありますしています電話機をビデオプレーヤーから抜ける)。

video.webkitExitFullScreen()video.play()ように見える

このアンドロイド4に無視されているHTML5マークアップと私が使用しているJavaScriptコード、あなたは私が解決策を指して助けてくださいだろうか?

ありがとうございます!

<head> 
    <meta charset="UTF-8"> 
    <meta name="viewport" content="width=device-width; initial-scale=1.0" /> 
    <meta name="description" content="" /> 
    <title>test</title> 

    <script type="text/javascript"> 

     function videoEnd() { 
      var video = document.getElementById("video"); 
      video.webkitExitFullScreen(); 
      document.location = "http://www.google.com"; 
     } 

     function playVideo() { 
      var video = document.getElementById("video"); 
      video.addEventListener('ended', videoEnd, false); 
      video.webkitEnterFullScreen(); 
      video.play(); 
     } 

    </script> 
</head> 
<body> 
    <video id="video" poster="../img/image.jpg" onclick="playVideo();"> 
     <source src="../video/videoname.3gp" type="video/3gpp" /> 
    </video> 
</body> 
+0

video.webkitEnterFullScreen();これはAndroid 4.1であなたのために機能しましたか?疑わしい。 –

答えて

0

私は最近同様の問題がありました。ウェブ検索の時間後、ここに私はそれがうまくなさ方法は次のとおりです。

「再生()」メソッドを呼び出す前に、「負荷()」メソッドを使用します。だからあなたのコード:

function playVideo() { 
     var video = document.getElementById("video"); 
     video.addEventListener('ended', videoEnd, false); 
     video.webkitEnterFullScreen(); 
     video.load(); 
     video.play(); 
    } 

私はアンドロイド2.2と2.3とIPhone 3でテストしています。しかし、アンドロイド4.0で再生していないようです。

P.S.

あなたがビデオを使用して、このイベントを再生が完了すると、リダイレクトしたい場合:

var video = document.getElementById("video"); 
video.addEventListener("ended",doSomething,true); 

function doSomething() { 
    //your redirect code here 
} 
+2

ありがとうございます。残念ながら私はAndroid 4で動作する必要があります。 – guidobras

1

私はあなたを助けるかもしれないいくつかの提案を持って、

これは、AndroidのWebビューアプリケーションではありませんアンドロイドのため適用されますウェブアプリケーション。

あなたはアンドロイドのフックアップやAndroidのWebビューのクライアントを作成するか、変数(クエリ文字列)として値を渡すと、すべてのコントロールを持っているAndroidのネイティブからビデオを再生。

ビデオを再生するためのコードを見つけてください。あなたがブライトコーブの種類を実装する場合

enter code here 

public void videoPlayer(String path, String fileName, boolean autoplay){ 
getWindow().setFormat(PixelFormat.TRANSLUCENT); 
//the VideoView will hold the video 
VideoView videoHolder = new VideoView(this); 
//MediaController is the ui control howering above the video (just like in the default youtube player). 
videoHolder.setMediaController(new MediaController(this)); 
//assing a video file to the video holder 
videoHolder.setVideoURI(Uri.parse(path+"/"+fileName)); 
//get focus, before playing the video. 
videoHolder.requestFocus(); 
if(autoplay){ 
    videoHolder.start(); 
} 

}

、私は5

乾杯

それはアンドロイドのそれ以降のバージョンに思える
0

、プログラム的video.play() HTMLのために役立ちます私に連絡WebViewからの明示的な承認が必要です。例えば

settings.setMediaPlaybackRequiresUserGesture(false);

1

私は、これは古い記事ですけど、誰かがこれを探していてもよいです。 個人的に私はビデオが終了した後で単純なjquery $ videoElement.hide()を使ってvideo要素を隠すだけで、自動的にブラウザに戻ります。

私たちはいくつかのモバイルデバイス(iOSとAndroid)でこれをテストしました。

まだ私のブラウザはフルスクリーン(私の場合は他の問題を引き起こしている)のようですが、まだ別の問題があります。

+0

上記以外にも: グーグルでは、フルスクリーンの問題の問題は次のようになっています。 ビデオ要素を非表示にすると、ビデオプレーヤーからブラウザ。 Androidでは、フルスクリーンモードを終了するには、ユーザーアクションが必要であると言われています(上から下にスワイプする)。そのため、ブラウザはフルスクリーンモードのままです。 私はそのための修正を見つけませんでした。これはAndroidの仕組みなので、動画が完成した後、ユーザーは動画から抜け出してウェブサイトに戻る必要があると判断しました。 – vrijdenker

関連する問題