Edge Animate では、HTML5 ビデオがネイティブサポートされているので、お好きなビデオクリップをコンポジション内で簡単に使用できます。ビデオの再生は、基本的な再生アクションと JavaScript を使用して制御できます。また、ビデオエレメントをタッチイベントやマウスイベントにバインドし、豊かでインタラクティブなエクスペリエンスを作り出すことも可能です。
ビデオ再生機能は、HTML DOM でサポートされています。したがって、プラグインを必要とせず、任意の最新のデスクトップコンピューターやデバイスのブラウザーでビデオが再生できます。
ブラウザーの枠を超えて最高の互換性を実現するには、.mp4 および .ogv 形式のビデオエレメントをプロジェクトに加えてください。対応するビデオ形式について詳しくは、HTML5 の audio 要素と video 要素でサポートされているメディアフォーマットを参照してください。
次のいずれかの操作を実行します。
- ファイル／読み込みをクリックするか、ビデオファイルをファイルシステムから直接ステージにドラッグ＆ドロップします。ビデオファイルの名前の付いた「ビデオグループ」がライブラリに作成されます。このビデオグループには、ビデオファイルに加え、異なるブラウザー間の互換性を維持するために追加したフォールバックファイルが含まれています。
注意：フォールバックファイルは、コンポジションで読み込むと、自動的にビデオグループに名前別に分類されます。
コンポジションにビデオを追加すると、エレメントパネルに「ビデオエレメント」が表示されます。エレメントパネルでそのビデオエレメントを選択すると、ビデオの再生を制御するためのオプションがプロパティパネルに表示されます。
ビデオの再生および制御には、以下のオプションが用意されています。
- プロパティパネル
- 自動再生：タイムラインおよびデスクトップブラウザー上でビデオファイルを自動的に再生します。
- ループ：再生が終わったビデオファイルを最初からループ再生します。
- タイムライン
- 再生：現在の再生ヘッドの位置からビデオファイルを再生します。
- 途中から再生：ビデオの再生を開始する位置をタイムマーカーで指定できます。
- 一時停止：ビデオを一時停止できます。再生を開始するには、再生機能を使用します。
コンポジションを読み込む前にビデオファイルをプリロードするには、ステージのプロパティパネルにあるプリロードセクションで「オーディオをプリロード」を選択します。
注意：ほとんどのモバイルデバイスでは、ビデオのプリロードを利用できません。制限事項については、デバイスでのビデオの使用を参照してください。
ブラウザーのデフォルトのメディアプレーヤーを使用してビデオコントロールを表示できます。デフォルトのビデオプレーヤーは、初期設定では非表示になっています。デフォルトのプレーヤーを有効にするには、ビデオエレメントを選択し、プロパティパネルの「ビデオ」セクションで「コントロール」を選択します。
プレーヤースキンはブラウザーによってレンダリングされ、表示されるブラウザーに応じて見た目が異なります。例えば、Chrome で表示されるプレーヤーは Firefox で表示されるものとは異なっています。
iOS（iPad などのすべてのデバイス用）の Safari では、ユーザーが携帯電話ネットワークを使用している場合、データ単位で料金が請求されることがあるので、プリロード、自動再生および再生アクションは無効にしておきます。ユーザーがビデオを再生するまでデータは読み込まれません。
ユーザーイベントによってトリガーされたビデオエレメントを、ビデオアクションを使用して呼び出すこともできます。ビデオアクションについて詳しくは、ビデオアクションを参照してください。
Twitter™ および Facebook の投稿には、Creative Commons の規約内容は適用されません。