2019年06月4日(火)
YouTube動画をクリックなどのイベント操作で読み込む方法
Webページ上にYouTube動画を複数貼り付ける際、
掲載する動画の数が多くなるにつれて通常の埋め込み方法では
ページの読み込みに時間がかかってしまうことがあります。その様な場合、通常のYouTube埋め込みではなく
ユーザーのクリックイベントなどで動画を読み込むようにすることで
ページロード時の負荷を軽減させることができます。ページロード時にはYouTube動画を読み込まずに
ボタンをクリックすることで読み込みを開始し
動画を自動再生させるサンプルを作ってみたのでご紹介してみます。YouTube動画をクリックなどのイベント操作で読み込む方法
「YouTube動画をクリックなどのイベント操作で読み込む方法」サンプルを別枠で表示上記のサンプルでは画面上に3つのボタンを設置し、
それぞれクリックすることでボタンの位置にYouTube動画プレイヤーを生成し
指定したYouTubeの動画を読み込んで自動再生させます。動画は読み込むと同時に自動再生されますが
スマートフォン...
0
47
1
4
author:
BlackFlag
マークアップエンジニア矢次悟郎さんによる、jQueryをはじめとしたWebサイト制作に役立つで技術やサービスの情報発信ブログ
Ads
マークアップエンジニア矢次悟郎さんによる、jQueryをはじめとしたWebサイト制作に役立つで技術やサービスの情報発信ブログBlackFlagの記事『YouTube動画をクリックなどのイベント操作で読み込む方法』についてまとめています。
この記事は特にjavascript・jQuery・ダウンロード・スマートフォン・Google・youtube・動画・LINE・iOSについて書かれており、 気になるWebデザインの記事やまとめを見つけたら「本文を読む」をクリックすると、記事配信元のBlackFlagで全文を閲覧することができます。RSS Sourceの「このサイトの記事一覧」をクリックするとBlackFlagの記事をまとめて表示することができます。また閲覧数や各SNSのシェア状況を目安に、他の人たちが記事をどのように評価しているのか推測することができます。Webデザインにとって有益な記事をまとめていますので、ぜひリンク先をチェックしてみてください。
