autoplayを設定しているのに自動再生できない!
コーディングの際に以下のように動画を設置すると、スマホ(特にiOS)では自動再生がされないことが多いようです。
<video src="../movie_sample.mp4" autoplay loop muted></video>autoplay(自動再生)もmuted(ミュート)も設定しているのにどうして自動で再生されないのでしょう….
【解決方法】「playsinline」の追記
とりあえず、自動再生できるように以下のように”playsinline“を追記することで大半のスマホで自動再生が可能となります。
私のコーディング中に起きた問題もこの方法で解決しました。
<video src="../movie_sample.mp4" autoplay loop muted playsinline></video>playsinline
動画を「インライン」で再生する、すなわち要素の再生領域内で再生するかを指定します。この属性がないことが、動画を常に全画面で再生するという意味ではないことに注意してください。
iOSでは別の問題で再生できないことも
iOSのバッテリー管理を「低電力モード」にしているとほぼ動画の自動再生が停止されてしまいます。
それ以外の場合であれば「playsinline」の記述でほとんどの端末で問題が解決します!
小林祐也
2024.06.18