2017-10-11 10 views
0

正しいコーディングを確認する必要があるときに、HTML5や他のウェブデザイン技術をチェックするためにw3schools.orgにアクセスすることがあります。私はビデオを埋め込むときに代替画像を設定する方法を見ていない。動画要素(https://www.w3schools.com/html/html5_video.asp)とYouTubeの吹き出し(https://www.w3schools.com/html/html_youtube.asp)の両方を確認しました。YouTubeビデオの代替ティーザー画像を設定することはできます

今後の規定が有効かどうかは誰にも分かりますか?

私の回避策は、お気に入りのスクリーンショットをYouTubeのURLにリンクすることです。私が宣伝したいクリスチャンのミュージックビデオのために私はYouTubeのマイニングを行いました。そして私は私のウェブサイト:BibleBrowse.orgで特集したビデオを設定しました。私はビデオURL、私のティーザー画像のファイル名とビデオのテキストの説明のアニメーションJavaScript配列を持っています。以前の質問の助けを借りて、私はgetMonth()がプロセスを自動化するための正しい月次ビデオを選択させるようにしました。

単純にHTML5ビデオ方式を使用するのは良いことですが、その間に私が解決できる課題があるのは良いことです。

+0

負荷時間を最小限に抑えるため、私はホームページにおすすめビデオを埋め込んでいません。私がそれを理解したら、別のブラウザタブでYouTube URLを起動し、マルチメディアページにつながる別のリンクを作成する予定です。現在、私は自分のサイト上のすべての画像の画像ポータルとして本質的に機能するImageVuと呼ばれるものに取り組んでいます。今のところ、私はほぼ毎年行われているビデオスクリーンショットを完成させました。私はImageVuの別の「インスタンス」を使ってキリスト教の映画のページを改造する予定です。 ImageVuは、基本的に、リンクプルダウンから画像を動的に変更するWebフォームです。 –

答えて

0

私はあなたがposterタグ

を探していることは、以下のようなものをうまくいくと思います。

<video controls="controls" poster="image_url_to_show_while_video_loads"> 
    <source src="video.mp4" type="video/mp4" /> 
    <img src="img_url_to_show_if_browser_does_not_support_html5" title="Your browser does not support the video tag" /> 
</video> 
+0

私は多分私のマルチメディアページでそれを試してみましょうので、ホームページの読み込み時間を遅くする方法はありません。 –

+0

これは後で微調整するかもしれません。毎月の動画がJavaScript配列で事前に設定されていることを考慮すると、HTML5コードは動画形式に適合する必要があります。変数を埋め込みビデオ(YouTubeのリンクとティーザーの画像/ポスター)に変更/設定するためのJavaScriptを取得するためのIDを設定する必要があります。ビデオが埋め込まれて表示されるので、私は単にソース行を省略します。 –

関連する問題