回正题，这次要说一下现在用的主题里面的jQuery效果：

1、AJAX评论

Ajax评论对大家来讲陌生的东西，这个功能的时候方法有很多，也有专门的插件来实现这个功能。想要自己动手做的朋友可以参考一下K2主题代码或者是笑傲人生的文章“使用 jQuery 实现 wordpress 的 Ajax 留言”。文章里对Comment.js文件都有详细的解释。功能的实现不是太复杂的，至于那些样式的定义就随个人喜欢了，看明白了comment.js文件就可以自己定义提交过程，和提交后的样式。

我这里是在提交过程中加入了一个GIF进度图片，网速快的时候这个效果就是一闪而过，但对于网速不好的朋友，搞这样一个山寨进度条还是OK的。

2、@评论预览

@评论预览是前两天才加上去的，年前看了PhilNa的两篇文章（上，下），但本地试验的时候做不出来。直到前两天MG12把用于nvoie主题的@评论预览代码放出来，修改了一下代码就可以在我的博客上实现这个功能。

如果你已经安装了Mail To Commenter插件，加上这个jQuery应该会很酷！！

3、隐藏评论回复按钮

<script>
    $(document).ready(function(){
    $(".comm-reply").hide();
    $("#commentlist li").hover(function() {
    $(this).find(".comm-reply").show();
    }, function() {
    $(this).find(".comm-reply").hide();
    });
    });
</script>

Jat-Theme里面是当鼠标位于评论区域的时候才显示“回复”按钮。实现这个只需要加入一小段代码就OK了，这部分代码来自Jinwen老兄。

© Alex for Just A Blog, 2009. | Permalink | 28 comments | Add to del.icio.us | Follow me @attacker_hu
Post tags: AJAX评论, jQuery, 评论系统

您可能也喜欢：
利用jQuery特效收起评论栏目	最近无法AJAX评论	评论回复插件Mail To Commenter	整合IntenseDebate评论系统到WordPress	五套WordPress评论表情下载
无觅

不知道大家有没有发现，评论信息框有那么一点的变化了。在你发表了一次评论后就会记录你的输入信息，下次发表评论的时候只关心评论内容就OK了，可以简化那么一点的工作，不知道这点评论系统的改进算不算是“用户体验”的提高呢！

这个并不是什么新鲜的功能了，感兴趣的朋友可以看看“适当隐藏输入框，提高WordPress访客评论时的用户体验”。在加入这个功能后，我反而对这个隐藏和显示评论输入框的代码感兴趣，这几句代码的切换的速度比用jQuery特效速度快。这个刚好是可以用在改进评论栏和显示相关文章上（评论和相关文章的收起请看“利用jQuery特效收起评论栏目”）。

目前来说使用这些代码来显示相关文章是没有问题了，因为文章右侧的相关文章是使用ID包起来的，和评论输入框道理一样。至于我的评论栏，全部都是Class包住的，而这个代码只能获取ID，不知道那位达人可以告知一下，让我在Class里面使用这个函数。

2、文章底部分享和收藏图标

由于近期博客流量严重不济，有往下发展的趋势，没有一点蒸蒸日上的兆头，所以就加了几个小图标在文章底部，希望各位老大看完了文章觉得好的就顶一下或者是收藏一下，O(∩_∩)O！

其实我也不怎么清楚能不能通过这个途经来增加流量，试一下吧！我这几个收藏按钮的制作也就是通过那些收藏网站的API链接接口做的，想自己动手的朋友可以参考一下share this中文版插件的代码，里面列出很多网站的通用接口。自己懒得做可以直接安装一个分享和收藏插件，可以看一下《WordPress分享和收藏插件》。

随便推荐一个图标网站Fasticon，这是一个承接付费服务的设计网站，但里面也有很多Web 2.0风格的图标提供免费下载，我使用的这套也是从里面下载的。

3、关于博客内容

近期貌似遭遇博起的瓶颈，不知道写什么东西好，上一篇写了几个社会显示，发现越是关注这些内容越是郁闷，然后就会变得越来越愤青！！如果真的是要把那么多社会显示放上来，那么被和谐的机会就很大，而且还会搞得自己很郁闷！！看来还是莫谈国事比较好，要谈也是谈一下开心的，可以娱乐一下自己！！

© Alex for Just A Blog, 2008. | Permalink | 55 comments | Add to del.icio.us | Follow me @attacker_hu
Post tags: jQuery, 优化, 分享和收藏, 博客, 评论系统

您可能也喜欢：
利用jQuery特效收起评论栏目	使用jQuery增强主题评论功能	调整博客侧栏和Adsense单元	通过SEO优化增加博客访问量	关于国外的付费评论
无觅

制作的方法很简单，不需要对主题文件做很大的修改，只需加上几句代码就可以了。需要实现更多的功能查看一下jQuery Demo，也可以把jQuery Demo文件下载，自己研究一下。

1、header文件的修改

A、加入jQuery.js文件

<script type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js">
</script>

B、定义所需要的效果代码：

<script type="text/javascript" charset="utf-8">
$(".commentmetadata").click(function(){
$(this).next(".message_body").slideToggle("fast")
$(this).toggleClass("active");
$(this).siblings(".commentmetadata").removeClass("active");});

$(".collpase_all_message").click(function(){
$(".message_body").slideUp("fast")
return false;});
$(".show_all_message").click(function(){
$(".message_body").slideDown("fast")
return false;
});
});
</script>

2、comment.php文件的修改

A、把评论者信息包住：<div class=”commentmetadata”>评论者信息</div>；

B、把评论内容包住：<div class=”message_body”>评论内容</div>；

C、在显示评论<ol class=”commentlist”>的前面加入：

<p class=”collapse_buttons”>( <a href=”#comments” class=”show_all_message”>显示所有评论</a> | <a href=”#comments” class=”collpase_all_message”>收起所有平论</a> )<a href=”#respond”>马上发表评论>></a></p>

在根据博客的主题样式修改这些新加入的class就OK了。由于加载的jQuery文件来源是在Google，不喜欢这样的可以修改成本地加载。如果特效无法显示可以参考一下jQuery Demo的源代码。想了解更都jQuery方面的文章可以参考sofish一下“写给设计人的10个jQuery特效”，上面所有的东西都是从这个文章里面学习过来的。

目前在我这里效果是做出来了，接着要做的就是对JS文件的压缩，网上也有很多这方面的例子，但是目前我还没有对JS文件压缩成功～可能是自己太笨了。希望有这方面经验的博友可以指点一下，在JS文件压缩或者JS文件重写方面指导一下～～

© Alex for Just A Blog, 2008. | Permalink | 14 comments | Add to del.icio.us | Follow me @attacker_hu
Post tags: jQuery, 优化, 评论系统

您可能也喜欢：
使用jQuery增强主题评论功能	评论回复插件Mail To Commenter	近期对博客的几点修改	整合IntenseDebate评论系统到WordPress	关于国外的付费评论
无觅