詳細情報
※この映像は、デモ用にAIで出力したので、ちょっと怖いんですけどご了承下さい。
こちらはサムネイルでの切り替えには対応しておりません。
動画を直接配置したサンプル
mp4の動画ファイルを直接読み込んだサンプルです。詳しくはhtml側をご覧下さい。
簡単な解説は以下です。
- controls…動画の操作ボタンの表示。
- muted…デフォルトでは消音に。
- playsinline…自動的にフルスクリーンになる環境があるので、そうならない（このままで再生される）ように。
YouTubeからiframeで読み込んだサンプル
動画のアスペクト比は16:9で、一般的なYouTubeのサイズになっています。
アスペクト比は、cssの「iframe-box」部分で指定しています。これは、フッターのマップにも使われていますので、変更される際は両方適用されるため注意して下さい。