前言

拖了这么久，决定用fancybox.js来搞个图集凑合凑合

简单了解fancybox

详情请参照官网

官网介绍如下：JavaScript lightbox library for presenting various types of media. Responsive, touch-enabled and customizable.看不懂的路过

这里我们使用fancybox3，首页点击下载

往下拉可查看demo效果

下载至桌面，解压得到该文件夹。

浏览器下打开该文件，阅读文档

在How to Use下面查阅代码例子

在Options下查看fancybox的一些参数

在hexo博客中使用fancybox

方案一

在文章.md文件中使用raw标签直接插入如下代码：

这种方法有些太麻烦了，于是有了方案二。

方案二

在文章.md文件中使用raw标签直接插入如下代码:

接着使用js给他转换成需要的格式。

博主是在footer的模板下插入如下代码

方案三

这里只提供个思路，因为方案二版的实现很简便，就没去折腾了。

大致思路即是修改maked.js生成渲染的规则，根据图集图片的特定标志，识别出来，把需要的a标签渲染出来。直接生成文件。

实现过程可参照我之前的两篇文章OwO-可爱的js表情符号插件和Lozad.js学习使用