vedio-js的视频插件用法

时间:2019-04-18
本文章向大家介绍vedio-js的视频插件用法,主要包括vedio-js的视频插件用法使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。
<!DOCTYPE html>
<html>

    <head>
        <meta charset="UTF-8">
        <title>Vedio_Js使用</title>
        <link rel="stylesheet" type="text/css" href="css/reset.css" />
        <link rel="stylesheet" href="css/video-js.css">
        <script src="js/video.min.js" type="text/javascript" charset="utf-8"></script>
        <script type="text/javascript" src="http://img.huiyiguanjia.com/CDNFile/jquery/jquery-1.10.2.min.js"></script>
    </head>

    <body>
        <style>
            /*调整播放按钮*/
            .type3_3s_02 .video-js .vjs-big-play-button {
                width: 1.5em;
                height: 1.5em;
                border-radius: 50%;
                font-size: 2.5em;
                margin-left: -0.7em;
                margin-top: -1em;
                line-height: 1.4em;
            }
            
            .type3_4s_02 .video-js .vjs-big-play-button {
                width: 2em;
                height: 2em;
                border-radius: 50%;
                font-size: 3em;
                line-height: 1.8em;
            }
        </style>

        <div class="fl type3_4s_02">
            <div class="video-box1">
                <video class="video-js vjs-default-skin vjs-big-play-centered" loop controls preload="none" width="412" height="230" webkit-playsinline="true" playsinline="true" poster="img/vedio4.jpg" data-setup="{}">
                    <source src="vedio/4.mp4" type='video/mp4' />
                    <track kind="captions" src="demo.captions.vtt" srclang="en" label="English"></track>
                    <!-- Tracks need an ending tag thanks to IE9 -->
                    <track kind="subtitles" src="demo.captions.vtt" srclang="en" label="English"></track>
                    <!-- Tracks need an ending tag thanks to IE9 -->
                </video>
            </div>
        </div>

    </body>

</html>

 文件下载路径:https://i.cnblogs.com/Files.aspx  ——vedio_js.zip