解决fancybox与图片链接冲突的问题 - Sanarous的博客

解决fancybox与图片链接冲突的问题

在hexo中fancybox使用起来还是很方便的,图片点击放大功能也很好用,但是由于我的博客中使用了图片链接,如果点击图片跳转链接的话会提示The requested content cannot be loaded.Please try again later错误,这就挺讨厌了,Google了半天,最终找到了一个解决办法。在这里感谢原作者

添加如下代码:

文件位置:hexo/themes/next/source/js/src/utils.js
1
2
3
4
5
6
7
8
9
wrapImageWithFancyBox: function () {
    $('.content img')
      .not('[hidden]')
      .not('.group-picture img, .post-gallery img')
      .each(function () {
        var $image = $(this);
+ if ($(this).hasClass('nofancybox')) return;
        var imageTitle = $image.attr('title');
        var $imageWrapLink = $image.parent('a');

然后在使用的时候,给不需要fancybox的<img>标签中添加class属性class="nofancybox",如果class属性中已经有其它内容,也可以以空格并列,比如class="bestzuo nofancybox"

然后就可以完成了!

如果这篇文章对您很有帮助,不妨
-------------    本文结束  感谢您的阅读    -------------
0%