美文网首页让前端飞程序员前端开发笔记
【H5】iOS系统下的video视频播放完后重新刷新视频

【H5】iOS系统下的video视频播放完后重新刷新视频

作者: 废柴码农 | 来源:发表于2019-02-01 00:16 被阅读1次

    业务需求是H5页面中嵌套video视频,自定义控制视频暂停或者播放,但是对于ios系统下手机,会出现两个问题导致自定义播放事件失效:
    1.ios系统下视频自动回放全屏幕播放
    2.播放完之后定义在最后一帧图片上

    最终目的是video播放完之后实现刚加载出页面时候的效果(即第一张图片效果)
    [加载完页面时候的样式]
    播放完之后视频

    重新刷新视频即使重新刷新video标签的src,所以代码如下:

            videoplay.addEventListener('ended', function (e) {
           // 播放结束时触发的时候使播放图标显示,同时播放完之后重新加载video的src
               videoPalse.style.display = "block";   //播放图标显示
               videoplay.src=require("./../../assets/laterImg/westlake.mp4");  //不是react框架写的直接写路径就可以
               })
    
    注意:我的内容是使用react写的,所以图片用到了require语法,如果不是react直接用路径就可以

    相关文章

      网友评论

        本文标题:【H5】iOS系统下的video视频播放完后重新刷新视频

        本文链接:https://www.haomeiwen.com/subject/gdhrsqtx.html