怎么在網(wǎng)頁端插入透明視頻呢，之前在做Web3D項(xiàng)目時(shí)，使用threejs可以使綠幕視頻透明顯示在三維場(chǎng)景中，但是在網(wǎng)頁端怎么讓綠幕視頻透明顯示呢？

如圖上圖，視頻背景遮擋住后面網(wǎng)頁內(nèi)容

想要如下圖效果

之前有使用過ffmpeg，發(fā)現(xiàn)它可以扣掉綠幕，然后導(dǎo)出透明背景的webm視頻格式，執(zhí)行命令如下：

ffmpeg -i video.mp4 -filter_complex "[0:v]colorkey=0x87231a:0.1:0.1[ckout]" -map "[ckout]" -map 0:a -c:v libvpx-vp9 -b:v 2M -c:a libvorbis output.webm

其中最重要的是 -filter_complex "[0:v]colorkey=0x87231a:0.1:0.1[ckout]" 中 0x87231a? 色值，它是是綠幕視頻背景的RGB值，具體可以換成你自己的綠幕值。

引用如下：

<video id="video"><source src="./output.webm" type="video/webm"><p>您的瀏覽器不支持內(nèi)嵌視頻，請(qǐng)升級(jí)至最新版或者使用其他瀏覽器觀看。</p>
</video>

ffmpeg的安裝使用及其他參數(shù)，可到我的另一篇文章里查看FFmpeg視頻切片

注釋：案例中綠幕視頻來源于網(wǎng)絡(luò)下載學(xué)習(xí)使用，這里如有侵權(quán)聯(lián)系我刪除~