videoタグでループ時の再生開始時間を指定する

メインビジュアルに動画を埋め込んだウェブサイトを制作してるの。

一番最初にページを読み込んだ時だけオープニング動画が再生されて、２回目以降はオープニングを含めずにリピート再生させたいんだけど、どうしたらいい？

videoタグをJavaScriptで制御することで解決できます！

一回目と二回目以降の再生開始地点をjavaScriptで制御してください↓

DEMOはこちら

<div id="container">
  <video id="movie1" src="sample.mp4" playsinline muted ></video>
</div>


<script>

    var movie1 = document.getElementById('movie1');
    
    // ページ読み込みが完了したら実行
    window.addEventListener('load', function(){
    
        // 一回目は15秒地点から動画を再生
        movie1.currentTime = 15; 
        movie1.play();
        
    });
    
    // 動画終了時の処理
    movie1.addEventListener('ended', function() {
    
        // 二回目以降は0秒地点から動画を再生してループする
        movie1.currentTime = 0;
        movie1.play();
    });

    
</script>