文章交互功能
控制文章页面上的交互功能:大纲导航、阅读进度、图片灯箱和代码块复制。
文章大纲
Tralume 会从文章的各级标题自动生成目录(大纲)。
- 桌面端:在主内容旁显示粘性侧边大纲,高亮当前可见的标题。
- 移动端:浮动按钮打开全屏大纲浮层。另有一个浮动按钮显示阅读进度百分比。
文章至少包含一个标题时自动渲染大纲,无需额外配置。
阅读进度指示器
屏幕右下角有一个浮动按钮,以百分比显示阅读进度。它会在文章页面出现,随读者滚动内容而更新。点击它会打开移动端大纲浮层。
图片灯箱
点击文章内容中的内联图片会以全屏浮层(灯箱)打开。灯箱支持:
- 双指捏合或按钮缩放
- 放大后平移
- 通过 × 按钮、点击遮罩或 Escape 键关闭
灯箱对所有内容图片自动生效,无需配置。
代码块复制
文章内容中的每个代码块在鼠标悬停时,右上角会显示复制按钮。点击后将代码内容复制到剪贴板,并短暂显示"已复制"提示。
复制按钮使用 codeBlockCopyLabel 和 codeBlockCopiedLabel i18n 键作为标签文案。
最后更新于 • alexma233