h5 播放连续多个视频 解决闪烁的问题

<div id="video_box"></div>
      <video id="vplayer_start" width="80%" height="auto" controls="controls" src="02-21-46.mp4"></video>
      <video id="vplayer" width="80%" height="auto" controls="controls" src="02-21-58.mp4"></video>
    </div>

#video_box{position: fixed;left: 0;top: 0;width: 100%;height: 100%;overflow: hidden;}
#vplayer_start,#vplayer{
  display: block; margin: 0 auto; width: 80%;
  position: absolute;left: 0;top: 0;visibility: hidden;
}

var startPlay=true;
      var vplayer_start = document.getElementById('vplayer_start');
      var vplayer = document.getElementById('vplayer');
      var vList = ['02-21-46.mp4', '02-21-58.mp4', '02-22-10.mp4','02-22-22.mp4','02-22-34.mp4','02-22-46.mp4','02-22-58.mp4']; // 初始化播放列表   
      var vLen = vList.length;  
      var curr = 0;



      vplayer_start.pause();
      vplayer.play();
      //第一个播放器开始播放的监听
      vplayer_start.addEventListener("play",function(e){
        setSrc(vplayer,curr++);
      });
      // 第一个播放器播放结束
      vplayer_start.addEventListener("ended",function(e){
        e.target.pause();
        vplayer.style.visibility = "visible";
        play(vplayer);
        e.target.style.display = "none";
        vplayer.style.display = "block";
      });
      //第二个播放器开始播放的监听
      vplayer.addEventListener("play",function(e){
        setSrc(vplayer_start,curr);
      });
      //第二个播放器播放完成
      vplayer.addEventListener("ended",function(e){
        e.target.pause();
        vplayer_start.style.visibility = "visible";
        play(vplayer_start);
        e.target.style.display = "none";
        vplayer_start.style.display = "block";
      });
  
      vplayer.addEventListener('canplay', function(e){
        if(startPlay){
          e.target.pause();
          vplayer_start.style.visibility = "visible";
          vplayer_start.play();
          startPlay=false;
        }
      })
      function play(video) {       
          video.play();   
          // curr++;   
          if(curr >= vLen){   
              curr = 0; //重新循环播放 
          }   
      }  
      function setSrc(video,index){
        video.src = vList[index]
      };

思路是用两个播放器，第一个播放器播放时给第二个播放器动态设置src，第二个播放器播放时给第一个播放器设置src，如此循环....