Discuz 使用 fancybox 代替原版灯箱

2020-06-01 19:54:00
 Discuz

source/function/function_discuzcode.php,将第 597 行更改为

$img = '<a href="{url}" data-fancybox="gallery" data-type="image"><img class="zoom" src="{url}" border="0" alt="" style="width:100%;height:auto" /></a>';

然后在模板的合适位置引入 fancybox 的 css 和 js 即可。

<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/fancyapps/fancybox@3.5.7/dist/jquery.fancybox.min.css" />
<script src="https://cdn.jsdelivr.net/gh/fancyapps/fancybox@3.5.7/dist/jquery.fancybox.min.js"></script>

注意:fancybox 依赖 jQuery !!
补充:已知此方式通过附件上传的图片是无效的,只能对用图床粘过来的图有效。

改完之后,文件上下文的情况:

    } else {
        if(defined('IN_MOBILE')) {
            $img = '<img'.($width > 0 ? ' width="'.$width.'"' : '').($height > 0 ? ' height="'.$height.'"' : '').' src="{url}" border="0" alt="" />';
        } else {
            $img = '<a href="{url}" data-fancybox="gallery" data-type="image"><img class="zoom" src="{url}" border="0" alt="" style="width:100%;height:auto" /></a>';
        }
    }