播放视频

<li onclick="showVideo(1)"><label>第1讲</label>怎样记住新知识？</li>

 

<div class="video">
      <video x5-video-player-type="h5-page" x5-video-player-fullscreen="true" controls
          poster="" src="" x5-video-orientation="landscape|portrait"></video>
          <span class="closevideo">关闭</span>
    </div>

// 播放视频
    function showVideo (num) {
     
      $('.video').show();
      $('video').attr('poster', './images/school/banenr_poetry.png') // 加载时图片
      $('video').attr('src', `./video/jiyifa_0${num}.mp4`) // 视频位置
    }

$('.closevideo').click(() => {
      $('.video').hide();
    })

 

.video {
  display: none;
  position: fixed;
  top:3rem;
  left:0;
  z-index: 100;
  background: #000;
}
/*视频播放*/
.video video {
  position: relative;
  width: 100%;
  height: auto; 
}
.closevideo {
  position: absolute;
  bottom: .2rem;
  left: .2rem;
  display: inline-block;
  font-size: .24rem;
  color: #fff;  
}