videoタグで再生のタイミングを調整したい場合

HTMLは下記で

<video id=”mainvideo” loop preload=”auto” muted=”muted” volume=”0″ playsinline poster=”代替画像”><source src=”/move.mp4″ type=”video/mp4″></video>

あとはJavaScriptで、

document.addEventListener(‘DOMContentLoaded’, function() {
var mainVideo = document.getElementById(‘mainvideo’);
setTimeout(function() {
mainVideo.play();
}, 3000); // 3000ミリ秒 = 3秒
});

と記述します。

オート再生とループ再生にも対応。

※追記:iPhoneでは「playsinline」の記述が必要のようです。

2024.02.01BACK