jQuery Video Extend

最新推荐文章于 2021-06-11 13:05:02 发布

转载最新推荐文章于 2021-06-11 13:05:02 发布 · 76 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/claireyuancy/p/7053286.html

文章标签：

#javascript #ViewUI

本文介绍了一款HTML5视频扩展插件，该插件允许用户为视频添加Logo及标记，支持通过jQuery调用。文章提供了插件的使用示例，并说明了如何处理非MP4格式的视频文件。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

HTML5视频扩展插件

能够加入Logo
加入标记

这里写图片描写叙述

用法：

下载：jquery-video-extend

<script src="js/jquery-2.1.4.min.js"></script>
<script src="js/jquery.video-extend.js"></script>

<script>
$(document).bind('ready',function() {
        $("#video1").videoExtend({
                logo: 'logo.png',
                logoLink: 'http://itmyhome.com',
                logoSize: [45, 20],
                markers: [{
                        time: 13.04,  // seconds
                        text: 'Chapter 1'
                }]
        })
});
<//script>

<video id="video3" width="450" height="260" controls loop autoplay>
    <source src="video/simple.mp4" type="video/mp4">
</video>

还有一种方式：

<video width="450" height="260" data-logo="img/logo.png" 
        data-markers='[{"time":13,"text":"Chapter 1"},{"time":150,"text":"Chapter 2"}]'>
    <source src="video/Sintel.mp4" type="video/mp4">
</video>