实现方法和一些注意事项。
引入jQuery和fancybox
P.S 如果已经引入jQuery就不需要了 加入header.php 前
<link rel="stylesheet" href="https://libs.cdnjs.net/fancybox/3.5.7/jquery.fancybox.css">
加入footer.php
看似寻常最奇崛,成如容易却艰辛。
实现方法和一些注意事项。
P.S 如果已经引入jQuery就不需要了 加入header.php 前
<link rel="stylesheet" href="https://libs.cdnjs.net/fancybox/3.5.7/jquery.fancybox.css">
加入footer.php
前
<script src="https://libs.cdnjs.net/jquery/3.4.1/jquery.min.js"></script>
<script src="https://libs.cdnjs.net/fancybox/3.5.7/jquery.fancybox.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$( ".fancybox").fancybox();
});
</script>
打开post.php找到
<?php $this->content(); ?>
改成
<?php
$pattern = '/\<img.*?src\=\"(.*?)\"[^>]*>/i';
$replacement = '<a href="$1" data-fancybox="gallery" /><img src="$1" alt="'.$this->title.'" title="点击放大图片"></a>';
$content = preg_replace($pattern, $replacement, $this->content);
echo $content;
?>
如果是instantclick全站无刷新,想要分离文章页的样式文件请在首页引入灯箱的css,否则会出现灯箱功能失效的情况。