videoをページを完全に読み込んでから自動再生させたい

Question

videoをページを完全に読み込んでから自動再生させたいのですが、
方法はあるのでしょうか？

<video id="video" poster="images/loading.jpg" loop muted playsinline>
		<source src="images/movie.mp4" type="video/mp4">
		<source src="images/movie.webm" type="video/webm">
	</video>

$(window).load(function () {
   $('#video').prop('autoplay',true); 
});

上記の方法で行ってもchromeやiphoneでは自動再生が始まりませんでした。
方法はあるのでしょうか

Comments

[m.ts10806]

「あります」でいいですよね。
可不可だけを聞かれてるみたいですし。

Answer 1

$('#video').prop('autoplay',true);

属性を切り替えてるだけで再生の指示を送っているわけではありません。
状況としては「自動再生」ではなく「HTMLすべて読み込んでからvideoスタート」です。

以下でどうでしょう（未検証）

$(function(){
  $("#video")[0].play();
});

https://arrown-blog.com/jquery-html5-tag/
https://qiita.com/8845musign/items/88a8c693c84ba63cea1d

ただ、「完全に読み込んでから」がどこまでを意図してるのか不明。
HTML自体は読み込んでも画像など表示されてるかどうかは別の話ですしね。

Comments

[buk]

うまくいきました。ありがとうございます