2

わかりました。ウェブサイトの紹介として、動画を全画面で読み込む必要があります。HTML5でこれを行うことはできますか、それともフラッシュを使用する必要がありますか?

誰かがこれを行う方法について説明するか、いくつかの良いリソースを教えてもらえますか?

ロードするWebサイトと、プレーヤーコントロールなどを使用せずに再生する5秒のクリップを作成してから、メインサイトに直接アクセスする必要があります。

この例とまったく同じです:http ://www.firecrackerfilms.com/

ありがとう :)

4

4 に答える 4

3

背景ビデオを設定する必要がある場合は、これを試してください

position:fixedビデオで使用し、 100% width/heightに設定し、ネガを追加して、z-indexすべての背後に表示されるようにします。

VideoJSを見ると、コントロールは単なる html 要素です。

HTML

<video id="background" src="video.mp4" autoplay>

CSS

#video_background {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: -1000;
}
于 2012-04-30T19:06:54.677 に答える
1

あなたの例のページはフルスクリーンではなく、フルビューポートでもありません。ページの黒い背景に溶け込む黒い背景を持つ小さなビデオです。それをやり過ごすことができれば、それはうまくいくでしょう。

気にするなら、iPad でHTML5 ビデオのイントロを自動再生することはできません。これは、iOSが禁止し、指が画面に触れてトリガーさautoloadautoplayない限りです。しかし、繰り返しになりますが、とにかく Flash を再生することはできません。

HTML5 ビデオをフル ビューポートにする場合、たとえば 4:3 モニターで表示される 16:9 ビデオの場合、ビデオをフルハイトにして、ビデオの側面を失います。逆の場合も同様です。これにより、ビデオの縦横比が維持されますが、ビデオ コンテンツの一部が隠れたオーバーフローで失われることに注意してください。

アスペクト比を気にしない場合は、@coder が示唆するように、ビデオheight: 100%を作成して .width: 100%

このため、例のサイトで彼らが行ったことに合わせて、動画を背景に溶け込ませる方がおそらく簡単です。

于 2012-04-30T19:15:36.297 に答える
0

ユーザーがリクエストした場合、実際のフルスクリーンは不可能だと思います。少なくともフラッシュでは不可能です。

ビューポート全体を埋める場合は、css を使用してビデオ要素のサイズを変更することで実行できますが、幅と高さをビデオのアスペクト比と一致しないものに設定すると、ビデオは引き伸ばされません。ボックスを埋めるために。代わりに、ビデオは正しい縦横比を保持し、ビデオ要素内でレターボックス化されます。ビデオは、縦横比を維持しながら、ビデオ要素内で可能な限り大きくレンダリングされます。

于 2012-04-30T19:05:49.030 に答える
0

これは、html5 と Flash ビデオ、および長所と短所に関する素晴らしいスレッドです: HTML 5 <video> タグと Flash ビデオ。長所と短所は何ですか?

個人的には、iPhone や iPad など、ほぼすべての種類のデバイスで動画を視聴できるので、html5 の方が好みです)。

しかし、html5 はフラッシュ ビデオほど強力ではありません。

一部のユーザーがブラウザーで JavaScript またはフラッシュ構成を無効にしていることも考慮する必要があります。

于 2012-04-30T19:04:29.573 に答える