前文提到了评论的无限ajax翻页,比较复杂,还是用一个简单点的方法吧,纯js实现的,利用了jQuery的infinitescroll插件,以前有提到利用实现的首页无限翻页效果,示例比如:现在W1主题的首页。既然引入了插件,多多利用下。
这次评论是顺序显示,顶部先显示最老的评论,滚动屏幕自动加载下一页,直到显示完毕,这可以用于博客文章页,比较符合阅读习惯。要是某篇文章评论数量很多,开启分页后用这个效果很不错~
这是Demo,我把付费主题W1p(仅售¥88)加上这个效果,需要升级的请联系我。
下面的代码很简单,先加载jQuery库,然后调用jQuery的infinitescroll插件。js下载地址可以参见我前面这篇首页无限翻页效果。
然后加入这段js来控制:
$('#thecomments').infinitescroll({
navSelector : "#comment_pager",
//评论翻页部分的id
nextSelector : "#comment_pager a",
// 评论翻页点击的id
itemSelector : "#thecomments li.comment" ,
// 这是需要载入的评论部分,根据你的主题修改
loadingImg : "img/ajax-loader.gif",// loading图片自己改
//animate : true,
bufferPx : 60,//增加这个数字,会提前加载
loadingText : "加载评论中...",
donetext : "评论加载完毕~"
},function(arrayOfNewElems){
//这里添加你需要的回调函数,比如回复按钮的js
});
Over~注意根据自己的主题修改选择器,这次够简单了吧~
PS:后台评论选项修改成这样比较合适:
话说我上一个主题就是用的这个。w1
[color=#003221]评论框上面的小工具怎么实现的?[/color]
@槑槑兽 ,用的qiqiboy的方法
学习了 !哈哈
我现在首页的AJAx翻页是提取自一个插件的。有空再弄评论AJAX翻页
@Wayjam ,恩,你那个也不错,原理跟我用的首页翻页是一样的
如此高级的东西,
我还是以后再折腾把...
做的很好 赞一个!!
才看了两篇文章就发现博主是如此的强大啊.呵呵.
顺便问下博主,你现在使用的这个主题的免费版是w1s吗?
@SayMe ,是的,w1p是付费版,样式稍微和我现在用的有点不一样。
和上次一样,还是infinitescroll 。我现在用的是提取自WP后台的AJAX,不过目前显示嵌套评论有点小问题。
目前还没有trackbacks.