3

私はHTML5ビデオ制御について多くのことを検索しましたが、javascriptを使用してビデオを制御することに固執しています。アプリケーションには知っておくべきルールがあります。

ユーザーがブラウザを操作することはありません。

私が達成しようとしているのは、
1）ビデオをフルスクリーンで開き、ビデオを再生する
2）ビデオが終了すると、ビデオを閉じるとビデオが画面から消えてhtmlコンテンツが表示される
3）ビデオの表示コントロールが表示されない常時。

javascriptでそのようなアクションを達成する最も簡単な方法は何ですか？

4

3 に答える 3

2

VideoJSは純粋な CSS ベースのビデオ プレーヤーであり、オープン ソースです。この問題を HTML5 で解決するには、VideoJS を選択するしかありません。

ビデオのコントロールについては、VideoJS には最初からいくつかのオプションがあります。

$("video").VideoJS({ 
      controlsbelow: false,
      showControlAtStart: false
});

フルスクリーンの問題については、私自身の解決策を見つけました。それをあなたと共有したいと思います。
画面サイズが分かっているので、全コンテンツの上にパネルを作りました。

.fullscreen {
    width:1280px;
    height:800px;
    z-index:10001;
    top:0;
    left:0;
    position:fixed;
}

ブラウザはフル スクリーン モードであるため、これをビデオ コンテンツの通常のフル スクリーン解像度として混在させないでください。

ビデオの最後で、可視性を非表示 (display:none) に変更しています

$("video").bind("ended", function () {
      $("#videoContainer").removeClass("fullscreen").addClass("hidden");
});

その後、コンテナ ウィンドウとビデオ コンテンツの両方が全画面表示になります。皆さん、ありがとうございました。

于 2010-10-21T16:30:04.193 に答える
0

1) フルスクリーンに関しては:

HTML5 ビデオをフルスクリーンにする方法はありますか?

2) ライトボックスのような jQuery プラグインを使用することを検討できるかもしれません。このようなものかもしれません。

編集： @Mziallaの回答を確認してください。

3）ビデオプレーヤーについては、これをチェックしてください：

http://videojs.com/

幸運を！

于 2010-10-21T13:58:42.587 に答える
0

コントロールを非表示にするには、on video 要素のコントロール属性を除外します。

たとえば、ユーザーがボタンをクリックするとフルスクリーンに入ることができますが、ビデオが「終了」イベントで終了するとフルスクリーンを終了するようには見えません。

したがって、exitfullscreen を「終了」イベントと組み合わせることはできません。

これは porpuse で作成されているようで、ユーザーが何かをしたときにのみフルスクリーンに出入りできるようになっています。

デモ: http://netkoder.dk/test/test0267.html

于 2014-03-01T21:21:37.507 に答える