MSVOD视频系统官网,MSVOD系统销售QQ:155224015

MSVOD魅思官网_MSVOD视频系统官方网站_电影网站建设源码

msvodV10更换视频播放器VideoJS

发布时间:2019-09-07 18:34
msvodV10更换视频播放器VideoJS

根据客户需求,由于部分视频在ckplayer PC端不能直接播放,在wap端却可以,主要是因为播放器问题,ckplayer默认播放器是flash的,所以导致一些视频加载不到,
这里给出基本的替换播放器的代码,这个仅仅是替换播放器,不能实现广告 试看等功能,如果你没有启用会员模式,换这个播放器会快一些

在video目录下play.html
找到
<div class="left-main">
把下面一行替换成以下代码

<div class="video_wrap">
            <div class="video_box">
                <div class="video_n">
                    <video id='myVideo'  class="video-js"></video>
                    <link rel="stylesheet" type="text/css" href="/static/VideoJS/video.min.css?v=3">
                    <script type="text/javascript" src="/static/VideoJS/video.min.js?v=1" charset="utf-8" > </script>
                    <script type="text/javascript" src="/static/VideoJS/video-conrtib-ads.js?v=1" charset="utf-8" > </script>
                    <script type="text/javascript" src="/static/VideoJS/myVideo.js?v=6" charset="utf-8" > </script>
                    <script type="text/javascript">
                    var vPath = '{$videoInfo["url"]}';
                    var myVideo=initVideo({
                        id:'myVideo',
                        url:vPath,
                    });
                    </script>
                </div>
            </div>
           
        </div>

然后把附件的压缩包解压到前台的 public目录下
在对应CSS下加样式
<style>
.video_wrap {
width: 100%;
margin-top: .1rem
}
 
.video_wrap .video_box {
position: relative;
width: 100%
}
 
.video_wrap .video_box::after {
content: '';
display: block;
width: 100%;
height: 0;
padding-top: 64%;
background: #000
}
 
.video_wrap .video_box .video_n {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0
}
 
.video_wrap .video_title {
background: #fff;
padding: .1rem;
font-size: .2rem;
font-weight: normal
}
</style>
就行了
msvodV10更换播放器videojs


上一篇:meisivodV10适用的各种mysql命令合集

下一篇:没有了