gitbook 插件 视频
1. local-video 插件
local-video 插件添加链接描述:使用Video.js 播放本地视频
1.1 安装
npm i gitbook-plugin-local-video
1.2 配置
"plugins": [ "local-video" ]
使用示例:为了使视频可以自适应,我们指定视频的width为100%,并设置宽高比为16:9,如下面所示
{
% raw %}
<video id="my-video" class="video-js" controls preload="auto" width="100%"
poster="https://zhangjikai.com/resource/poster.jpg" data-setup='{"aspectRatio":"16:9"}'>
<source src="https://zhangjikai.com/resource/demo.mp4" type='video/mp4' >
<p class="vjs-no-js">
To view this video please enable JavaScript, and consider upgrading to a web browser that
<a href="http://videojs.com/html5-video-support/" target="_blank">supports HTML5 video</a>
</p>
</video>
{
% endraw %}
另外我们还要再配置下css,即在website.css
中加入
.video-js {
width:100%;
height: 100%;
}
2. html
<a href="https://www.youtube.com/watch?v=DV72xnlTLd8" target="_blank"><img src="../images/youtube.png" width="250"
alt="IMAGE ALT TEXT HERE" /></a>