Skip to content

Fancybox

Mashiro edited this page May 4, 2019 · 8 revisions

在新版本主题中,自行构造了一段插图标签:

!{alt}(url)[th_url] 或者 !{alt}(url)

alt:图片标题;url:原图链接;th_url:缩略图链接。在指定了缩略图链接的时候,页面上优先显示缩略图,点击查看原图。

举个🌰:

!{image 1}(https://view.moezx.cc/images/2019/01/19/TVKDX147_006.png)[https://view.moezx.cc/images/2019/01/19/TVKDX147_006.th.png]

!{image 2}(https://view.moezx.cc/images/2018/01/15/PID50489279by.jpg)

**注意:**这不是标准的 Markdown 语法,如果为了文章将来的兼容性,你很介意这一点,那么可以改用 fancybox 定义的标准 html 标签:

<a data-fancybox="gallery" href="big_1.jpg"><img src="small_1.jpg"></a>
<a data-fancybox="gallery" href="big_2.jpg"><img src="small_2.jpg"></a>

如果你是从3.1.0及以下版本更新上来的,那么你应该还记得我曾经预留了一个预览图的 #old 方法:

不过很抱歉,在3.1.1版中,我将原来使用的预览图插件 baguetteBox.js 更换为了 fancybox,原有的 [![图片标题](../example.th.png)](../example.png) 写法在 fancybox 下使用非常不方便,所以只能做出了放弃以上方法的决定。对于使用原有 [![图片标题](../example.th.png)](../example.png) 写法的图片,有两个解决方案:①逐一修改原有标签;②后台界面中提供了一个是否启用 baguetteBox 的选项,启用后可兼容原版。