Open Guang1234567 opened 6 years ago
没错, 除了一些无法在Demo中使用的部分(例如Disqus通过AWS中转), 其他没同步过来的功能都是因为我太懒了... 哪天我找个时间把搜索功能迁移过来... 其实还有个全局BGM的功能加入TODO已经几个月了....(:з」∠)
@szhielelp 看了你下面这边文章, 我想在 jekyll 博客里加这个控件 lightbox 控件
您写的其中一种方法是: 好像需要额外打个标记 #subcontainer
$('#subcontainer img').on("click",function(){
event.preventDefault();
$(this).ekkoLightbox({
remote: $(this).attr('src'),
title: $(this).next().html()
});
})
不知道有没有更简单的办法, 如通过javascript 去自动加上 data-toggle="lightbox
由于本人搞android的, 不太懂 javascript, 结果参照别人的做法(不知道是不是最优的? 如能改进能否告知一下我):
<!-- lightbox 图片插件 -->
<script type="text/javascript" src="{{ "/lightbox/dist/ekko-lightbox.js" | prepend: site.baseurl }}"></script>
<script type="text/javascript">
(function(){
$("article img").each(function(index,value){
var aDom=$("<a></a>").attr({"href":$(value).attr("src")+"?inlineId=myOnPageContent"}).addClass("ekko-lightbox");
$(value).wrap(aDom);
});
})();
$(document).on('click', '[class="ekko-lightbox"]', function(event) {
event.preventDefault();
$(this).ekkoLightbox();
});
</script>
这个其实是我很早就安装的插件, 几个要点:
Markdown编译后的HTML格式必然和推荐格式不同, 因此只需要使用任何方法将格式改变成推荐格式并进行init即可:
<a rel="lightbox" href="path" data-lightbox="roadtrip" title="Enjoy It!">
<img src="path" alt="" class="img-fluid">
</a>
另外你提供的代码原理应该没有问题
Hello szhshp:
主网站 Home 那个"文章"列表(带搜索), 怎么跟 Demo 的截图有点不太一样的? 是部分功能开源吗?