20391依頼:mp4ファイルを連続再生してほしい24時間、黙々と動画をバックアップしているシステムがある。動画の内容チェック用に、その動画から任意の開始時刻~終了時刻の範囲をを切り出し、MP4に保存してくれる切り出しシステムも付いている。範囲は複数箇所指定できるので、保存されるMP4ファイルも複数だ。依頼は、その切り出しシステムが保存したmp4ファイル全てを、ブラウザのHTML5のVIDEOで連続再生したいというものだ。こりゃ楽勝とおもったら、ちょっぴりつまづいた、動画をシームレスに連続再生してくれという点にだ。条件まとめ動画の個数は何個になるかわからないファイル名は取得可能HTML5の<video>で再生することjQueryを使っても良い。最初に試した<video>を1個用意して、srcをjQueryで切り替える方法は失敗だった。いう風に、onendedのイベント時に、srcを切り替えると切替時のカクカク感がとても大きくNGが出た。理由はpreloadしていないから動画srcの切替時にカクカクする原因は、srcを切り替えの場合、preloadが効いていないのではないかと推測。preload対策のため、あらかじめ全部の動画分、<video>を生成する方式に変更。うまく動いたのはこれです。使ってforを使わずにすんだ。<video>をappendToしてるところ。.attr()のところ自己評価:ダサいと感じる点1個目を表示するのに、functionの外でこの寒さ。video:eq(0)').show();関数をキューに入れる作りのほうが、正解だと思ったけど作れなかった。感想<VIDDEO>を全部出力しといてhide()するのはダサイと思い、他の方法を試してみたが、カクカク感除去には<VIDEO>列挙法には及ばなかった。したほうがいいこともあるんだなと。要望に機能することが大切で、ダサイという概念で最初に引っかかってしまったこと深く反省。DEMOはこちら同じ動画ファイルを2回連続で再生しています。SamuraishockDOportfoliowebmagazineContact。