视频嵌入测试：四种播放模式

这篇文章用来测试博客的视频嵌入功能。支持 B站 和 YouTube 两大平台，书写语法为 ![[bilibili(BVxx)]] 或 ![[youtube(id)]]。

当前实现了四种播放模式，下面逐一演示。

<!-- more -->

一、标准模式（默认）

最基本的用法：缩略图占位 → 点击内联播放。B站用渐变色兜底卡（构建期可注入封面），YouTube 自动取 hqdefault 缩略图。

![[bilibili(BV17x411w7KC)]]

![[bilibili(BV17x411w7KC)]]

YouTube 同理：

![[youtube(dQw4w9WgXcQ)]]

![[youtube(dQw4w9WgXcQ)]]

二、画轴展开动画

点击播放时，播放器从画面中心向两侧展开（像展开一幅卷轴），0.9 秒缓动动画。所有视频默认带此效果，无需额外参数。

展开后鼠标悬停可看到右上角的 全屏按钮，点击可进入沉浸式弹窗模式。

三、八角画框 + 宣纸装饰（deco=octagon）

给视频加一个八角形异形窗口，配合宣纸纤维纹理和朱印角标。静态时像一幅挂画，播放后自动恢复为正常矩形。

![[bilibili(BV17x411w7KC, deco=octagon)]]

![[bilibili(BV17x411w7KC, deco=octagon)]]

带封面图的版本（构建期注入 B 站封面 URL）：

![[bilibili(BV17x411w7KC, cover=http://i1.hdslb.com/bfs/archive/5242750857121e05146d5d5b13a47a2a6dd36e98.jpg, deco=octagon)]]

![[bilibili(BV17x411w7KC, cover=http://i1.hdslb.com/bfs/archive/5242750857121e05146d5d5b13a47a2a6dd36e98.jpg, deco=octagon)]]

YouTube 八角画框版：

![[youtube(dQw4w9WgXcQ, deco=octagon)]]

![[youtube(dQw4w9WgXcQ, deco=octagon)]]

四、沉浸式弹窗（mode=immersive）

点击视频后不原地播放，而是弹出居中大窗口，带毛玻璃背景遮罩。适合想要沉浸式观看体验的场景。关闭方式：点击遮罩、按 ESC 键、或点右上角 ×。

![[bilibili(BV17x411w7KC, mode=immersive)]]

![[bilibili(BV17x411w7KC, mode=immersive)]]

YouTube 沉浸式版：

![[youtube(dQw4w9WgXcQ, mode=immersive)]]

![[youtube(dQw4w9WgXcQ, mode=immersive)]]

五、组合效果

所有参数可以自由组合。比如八角画框 + 沉浸式弹窗：

![[bilibili(BV17x411w7KC, cover=http://i1.hdslb.com/bfs/archive/5242750857121e05146d5d5b13a47a2a6dd36e98.jpg, deco=octagon, mode=immersive)]]

![[bilibili(BV17x411w7KC, cover=http://i1.hdslb.com/bfs/archive/5242750857121e05146d5d5b13a47a2a6dd36e98.jpg, deco=octagon, mode=immersive)]]

语法速查

默认行为：无额外参数 = 标准 facade + 画轴展开动画 + 内联播放 + 可展开全屏。