兜兜转转,又回到原点。由于当前所用主题没有图片灯箱预览,试用了某插件,感觉总是差那么点意思,就翻出来几年前的一段记录,这一试竟还有效,于是再记录于此以备后有所需。废话少说,直接上步骤:
在header.php中增加一个css样式
<link rel="stylesheet" href="<?php $this->options->themeUrl('js/jquery.fancybox.min.css'); ?>">在footer.php中增加如下代码
<script src="<?php $this->options->themeUrl('js/jquery.min.js'); ?>"></script>
<script src="<?php $this->options->themeUrl('js/jquery.lazyload.min.js'); ?>"></script>
<script>
setTimeout(function() {
$("img").lazyload({
effect: "fadeIn",
threshold: 100,
failurelimit: 2
});
},
100);
</script>
<script src="<?php $this->options->themeUrl('js/jquery.fancybox.min.js'); ?>"></script>
<script>
$('[data-fancybox="gallery"]').fancybox({
buttons: ["zoom", "slideShow", "fullScreen", "thumbs", "close"],
lang: "cn",
i18n: {
cn: {
CLOSE: "关闭",
NEXT: "下一张",
PREV: "上一张",
ERROR: "无法加载图片! <br/> 请稍后再试……",
PLAY_START: "开始预览",
PLAY_STOP: "停止预览",
FULL_SCREEN: "全屏",
THUMBS: "缩略图",
DOWNLOAD: "下载",
SHARE: "分享",
ZOOM: "放大"
}
},
slideShow: {
autoStart: false,
speed: 3000
},
});
</script>最后添加一个图片超链接,完成
找到文件var/Utils/HyperDown.php
将以下内容
<img src=\"{$this->_definitions[$matches[2]]}\" alt=\"{$escaped}\" title=\"{$escaped}\">替换为
<a href=\"{$this->_definitions[$matches[2]]}\" data-fancybox=\"gallery\"><img src=\"{$this->_definitions[$matches[2]]}\" alt=\"{$escaped}\" title=\"{$escaped}\"></a>
评论