zoukankan      html  css  js  c++  java
  • video.js多个视频在同一个页面的调用问题

    最近做项目,有一个需求是做视频列表,点击每一条列表,视频会在右边的播放区域播放,本人使用的是video.js插件,这个插件的API挺全的:http://www.jq22.com/jquery-info404

    解决办法:使用js动态替换视频的src路径

    html:

    <div class="build-videobox">
    <video id="build-video" class="video-js vjs-big-play-centered build-video" controls preload="none" poster="images/activity/lianzheng/lianzheng.jpg"
    data-setup="{}">
    <source src="./videos/lift.mp4" type='video/mp4' class="build-source" />
    </video>
    </div>
    js:
    function createVideo(video) {
    // 视频的地址
    var source = video.source;
    // 每次点击的时候出现播放按钮
    $(".vjs-has-started").css("display", "block");
    $(".vjs-big-play-button").css("display", "block");
    // 初始化video.js
    var myPlayer = videojs('build-video');
    // 暂停的时候出现播放按钮
    myPlayer.on("pause", function () {
    $(".vjs-has-started").css("display", "block");
    $(".vjs-big-play-button").css("display", "block");
    });
    // 视频播放的时候隐藏播放按钮
    myPlayer.on("play", function () {
    $(".vjs-big-play-button").css("display", "none");
    });
    $(".build-source").attr("src", source);
    myPlayer.src(source); //重置video的src
    myPlayer.load(source); //使video重新加载
    myPlayer.play();
    console.log(source);
    }
     
  • 相关阅读:
    Linux 下的dd命令使用详解
    理解Linux的inode
    2021.11.11
    转一篇DLL逆向的文章,适用于一般的dll逆向
    关于Exchange DSAccess组件目录检测机制
    一些KB
    Inside of my heart
    C/C++是程序员必须掌握的语言吗?
    一个自动检测并安装hotfix的脚本
    VC++中DLL的创建和使用
  • 原文地址:https://www.cnblogs.com/klkitty/p/8978728.html
Copyright © 2011-2022 走看看