相关文章还没诞生，先看看下面的吧

• 2008/05/23 -- 二区四组的联盟,你们除了会组国家队还会干什么?
• 2009/10/11 -- Gray&Green?
• 2008/05/23 -- 推荐个超华丽的播放器AirPlay
• 2009/07/15 -- 好吧，我被点名了。

　　结合Willin大师思路做出来的精简版：

$(document).ready(function() {
var botton='<span  style="cursor: pointer; color:#CC0033;background:#000;">点我</span>';
$('#box-botton').append(botton);
//向#box-botton内添加上面定义的按钮
$('#box-botton>p').addClass('box');//为#box-botton内的<P>...</P>内添加class=botton
$('.box').insertAfter('.botton');
//把按钮放在展开内容之前，因为默认会把按钮放在展开内容之后
$('.botton').click(function() {
$(this).siblings().slideToggle(500);return false;});
//使用siblings是为了选择全部包含class=box的段落，如果使用next或prev的话只能选择相邻的同辈元素，也就是上面的一个或下面的一个，如果存在多个段落的话就会失效。
});

　　现在这个应该算是比较完美的版本了，解决了按钮会落在展开内容下面的缺陷，但效果只有展开，如果需要更多效果，请参照后面的代码修改。

　　使用方法：在需要使用的地方用<div id=box-botton></div>包起来，如果你嫌字母太多的话，那就换个字母少的单词定义元素。

　　Demo：http://leo-n.cn/demo/demo2.html

　　之前的代码如下：

$(document).ready(function() {
var off='<span class="show-box" style="cursor: pointer; color:#CC0033;background:#000;">召唤出来</span>';
var on='<span class="close-box" style="cursor: pointer; color: #CC0033;background:#000;display:none;">解散回去</span>';//定义按钮
$('#box-botton').append(on);
$('#box-botton').append(off); //向#box-botton内添加上面定义的按钮
$('#box-botton>p').addClass('box');//为#box-botton内的p标签添加class=box
$('.box').insertAfter('.show-box');
$('.box').insertAfter('.close-box');
$('.show-box').click(function() {
$('.show-box').hide();
$('.close-box').show();
//$('.box').slideDown('slow');//缓慢展开
$('.box').fadeIn(1200);//在1.2s之内渐显
//$('.box').show();//直接显示
});
$('.close-box').click(function() {
$('.close-box').hide();
$('.show-box').show();
//$('.box').slideUp('slow');
$('.box').fadeOut(1200);
//$('.box').hide();
});
});

依葫芦画瓢，如果你喜欢收缩形式（如果你能无视在IE中的缺陷的话），你就选择slideDown和slideUp，如果喜欢直来直去的话，就选择Show和Hide，想有点效果又顾虑IE缺陷的话，就用现在默认的，恩对了，还是那句话，必须加载jQuery框架，且在footer.php里加载以上代码。

　　还有，使用之前务必在模板CSS里定义.box{display:none;}，当然，这样做出来你可能会觉得很简陋，呃，那就依自己喜好在.box里面加点佐料吧。

　　特别说明下，现在代码有一个可以称为bug的地方，就是展开后按钮位置是位于展开内容下面，对访客体验有点不好，但无奈于本人水平，没找到解决办法，高手请指点一下，我将不胜感激。已经解决。

　　Demo：http://leo-n.cn/demo/box.html

　　还有还有，我手上有几个淘江湖的玩偶邀请，想要的童鞋请留言，我能赠送的只限于下图显示为彩色的玩偶：

• 2009/11/13 -- 利用jQuery改变网页元素加载顺序
• 2009/11/05 -- 用jQuery隐藏回头访客资料输入框

　　不废话了，从Yculer的网站上看这次提供的应该是新手型的，所以我就把各项参数照搬过来了：空间600M，月流量6G，面板是CP，无限域名，子域名，电子邮件帐户，数据库账户，其他的参数可以我上传的探针：
http://blog.leo-n.cn/1d5vsaWx-1.php，再看看ping速度：

我的网络环境是云南电信ADSL2M，在我用过的国外主机里面，这个速度是我见过最快的，再来看下主机负载：

使用美国主机的好处就是我们可以和主机上的美国佬错开时间，所以，在白天负载是较低的，ftp上传下载速度基本能接近满速，这点我很满意。

　　第一次写主机评测，实在找不到写点什么，还是大家自己去感受下吧：http://blog.leo-n.cn/，感谢Yculer提供的主机。

• 2009/11/13 -- 利用jQuery改变网页元素加载顺序
• 2009/11/08 -- 副标题处显示嘀咕消息
• 2009/11/05 -- 用jQuery隐藏回头访客资料输入框
• 2009/11/04 -- 博客主题再次修改

　　我首先想到的方法就是把嘀咕的代码单独保存为一个php文件，加载到index.php的底部中，再利用css的绝对定位absolute把其定位到博客副标题处来显示，用top和left调整好位置后，在我笔记本屏幕上显示没有问题，但换到其他分辨率下，错位问题也就随之而来了， 具体原因请看absolute的定位原理：

元素框从文档流完全删除，并相对于其包含块定位。包含块可能是文档中的另一个元素或者是初始包含块。元素原先在正常文档流中所占的空间会关闭，就好像元素原来不存在一样。元素定位后生成一个块级框，而不论原来它在正常流中生成何种类型的框。

所以，这个方法被否决了，Google之后，我发现了另外的一个方法，就是本文标题所述的内容：利用jQuery改变网页元素加载顺序，下面就以副标题处显示嘀咕消息为例来介绍如何利用jQuery来改变网页元素的加载顺序。

　　首先，在header.php里添加一个id为digu的空白div，例如：

<div id="digu">
</div>

接着，到index.php的<?php get_footer(); ?>下面再添加一个id为digux的div，在里面加载之前独立保存出来的digu.php，写出来大概是这个样子：

<div id="digux">
<?php include_once("digu.php"); ?>
</div>

再在下面加入本文最核心的jQ代码：

<script type="text/javascript">
$('#digu').html($('#digux').html());
</script> >

也可以写成：

<script type="text/javascript">
$('#digux').children().clone().appendTo('#digu');
</script>

这段代码基本意思就是把id为digux的内容复制到digu之中，这样我们就成功的利用jQuery改变了副标题处嘀咕消息的加载顺序，因为header.php中的digu是空白层，真正的内容是在index.php的digux之中，所以，浏览器最后加载的是digux层，这样就不会因为外部引用的js导致博客打开缓慢或打开不完全了。

　　忘了说，实现以上效果我们还需在footer.php里加载jQuery框架以及定义digux的CSS为display:none，这就不做过多说明了，之前的文中有过介绍。

　　这篇文章旨在抛砖引玉，此方法适用的范围很大，大家可以尽情发掘使用。作为一个初识jQuery的人来说，我已经被jQuery的强大征服了。

　　文中jQ代码参考自http://leeiio.me/jquery-changes-divsorder/。

• 2009/11/05 -- 用jQuery隐藏回头访客资料输入框
• 2009/11/21 -- 利用jQuery实现文章部分内容收缩
• 2009/11/15 -- Yculer主机试用感受
• 2009/11/08 -- 副标题处显示嘀咕消息

　　第一个方法是修改hosts，此方法简单方便快捷，打开系统盘进入\Windows\System32\drivers\etc\，用文本编辑软件打开hosts，在里面加入：

64.147.188.86 www.xmarks.com
64.147.188.92 api.xmarks.com
64.147.188.89 login.xmarks.com
64.147.188.87 sync.xmarks.com
64.147.188.86 static.xmarks.com
64.147.188.86 download.xmarks.com
64.147.188.86 my.xmarks.com

保存，如果还是提示无法同步的话就进入Xmarks设置，高级，安全，加密选择全部加密即可。

　　第一个方法虽然简单，但如果功夫网直接封了Xmarks的ip的话，那也就失效了，所以，我们还可以这样做，前提你要有一个ftp（貌似有点废话，会进我博客的童鞋基本都是有空间的人），好了，下面介绍这个一劳永逸的方法。

　　打开Xmarks设置，在status，账户里面输入ftp帐号和密码，再到高级，服务器里选择使用自己的服务器，在地址处填入ftp://你的域名/xmarks/foxmarks.json，密码地址输入ftp://你的域名/xmarks/asswords.json，点击确定；接着到你空间对应目录下新建一个xmarks文件夹，并设置该文件夹能写入读取，此时全部操作完成。试着同步一次看看，成功了吧？

• 2009/04/12 -- Foxmarks升级至Xmarks.
• 2008/10/27 -- 我所使用的FireFox扩展

　　首先来介绍下什么是嘀咕，在这我就直接引用官方说明了：

嘀咕 (digu.com)，是新一代的实时博客服务，通过电脑或手机，用户可以随时随地快速记录所见所感，即时简单地了解朋友间彼此的生活片段，保持联系。

所以，我们必须先有一个嘀咕帐号，呃，帐号申请方法如下：（此处省略若干字……），帐号到手后，再去http://www.wudishow.com/处填入你的嘀咕帐号（也就是上面所述的OpenCloud帐号），依次点击创建无敌秀，嘀咕，Wodpress，JS，设置显示条数为1，再复制下面显示出的代码，此时，第一个步骤告一段落。

　　然后，打开你博客模板的header.php，在description下面粘贴复制好代码，保存。刷新下你的博客，一般情况下，你会发现效果惨不忍睹，所以，我们要在模板css里面添加：

#wudiShow a,#wudiShow_Header,#wudiShow_More {
display:none;
}

结束这一步后，你会发现效果好了一点，但什么错位之类的大家最讨厌了，所以，我们可以根据自己的情况用margin酌情调整下，此时，你的脸上应该浮现出满意的笑容了，哈哈。

　　当然，追求速度的童鞋可能有意见了，在头部加载一个JS文件会极大影响博客的整体速度，甚至会因为外部JS失效导致下面的内容无法显示，呃，其实这点我也考虑到了，什么？你想知道怎样解决？哈哈，请允许我先卖个关子，下一篇文章会做一个系统的介绍，那方法不仅仅只适用于嘀咕的显示哦。

　　最后附上我的嘀咕地址：http://www.digu.com/iske，欢迎大家踊跃跟随（就是特推的follow），你跟随我之后我也会第一速度跟随你的。: )

• 2009/11/15 -- Yculer主机试用感受
• 2009/11/13 -- 利用jQuery改变网页元素加载顺序
• 2009/11/05 -- 用jQuery隐藏回头访客资料输入框
• 2009/11/04 -- 博客主题再次修改

　　按照木木提供的方法，我再次悲剧的发现用在我博客上并不能正常工作，只能再次Google&百度，找到最后，终于在Xiaorsz的博客中找到个利用jQuery实现的方法，测试后工作正常，下面写点改动的地方。

　　首先，我们要编辑comments.php，在类似于：

<input type="text" name="author" id="author" value="<?php echo $comment_author; ?>" size="22" tabindex="1"/>

的评论者姓名输入框代码上方添加：

<?php if ( $comment_author != "" ) : ?>
<div id="welcome">
<?php printf(__('　Hi!　欢迎回来！<strong>%s</strong>.'), $comment_author) ?>
</div>
<?php endif; ?>

然后再把三个评论者姓名，电邮，网址的代码输入框用<div id="author_info"></div>包起来，到此，comments.php修改结束；

　　然后，新建一个名为inputhidden的js文件，把Xiaorsz提供的代码放进去：

$(document).ready(function() { //开始
if($('input#author[value]').length>0){ //判断用户框是否有值
$("#author_info").css('display','none'); //将id为author_info的对象的display属性设为none，即隐藏
var change='<span id="show_author_info" style="cursor: pointer; color:#2970A6;">change &raquo;</span>'; //定义change，style是定义CSS样式，让他有超链接的效果，color要根据你自己的来改，当然你也可以在CSS中定义#show_author_info来实现，这样是为了不用再去修改style.css而已！
var close='<span id="hide_author_info" style="cursor: pointer;color: #2970A6;">close &raquo;</span>'; //定义close
$('#welcome').append(change); //在ID为welcome的对象里添加刚刚定义的change
$('#welcome').append(close); // 添加close
$('#hide_author_info').css('display','none'); //隐藏close
$('#show_author_info').click(function() { //鼠标点击change时发生的事件
$('#author_info').slideDown('slow') //用户输入框向下滑出
$('#show_author_info').css('display','none'); //隐藏change
$('#hide_author_info').css('display','inline'); //显示close
$('#hide_author_info').click(function() { // 鼠标点击close时发生的事件
$('#author_info').slideUp('slow') //用户输入框向上滑
$('#hide_author_info').css('display','none'); //隐藏close
$('#show_author_info').css('display','inline'); })})}}) //显示change

保存文件。

　　接着，我们要载入jQuery框架，因为我之前添加过Willin大师的Ajax嵌套回复，已经在footer.php添加过，所以这一步我可以省略，没有添加过的童鞋可以在footer.php中加入：

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

然后在下面继续添加：

<?php if ( is_singular() ){ ?>
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/inputhidden.js"></script>
<?php } ?>

这部的先后顺序一定不能错，不然就无法成功。

　　OK，到此用jQuery隐藏回头访客资料输入框的全部操作就完成了，快试试去吧！Enjoy ！

• 2009/11/13 -- 利用jQuery改变网页元素加载顺序
• 2009/11/04 -- 博客主题再次修改
• 2009/10/11 -- IE&Firefox Hack
• 2009/10/11 -- Gray&Green?

　　再次唠叨下改动了几个地方：

　　1.去除之前透明效果，部分位置用图片产生伪透明效果。
为什么要去除透明效果？因为在IE7/8下，雅黑字体与透明滤镜有兼容问题，会产生诡异的字体模糊效果，解决办法只能是禁用滤镜或使用其他非ClearType渲染的字体，进而导致页面整体及其不协调。
　　2.对部分位置的文字添加了text-shadow属性，此效果在FireFox3.5.4中完美显示，在Chrome3.0.195.27中欠完美显示，在IE6/7/8中无效果，在其他内核浏览器中效果未知，希望各位能说说。
　　3.对评论者头像添加了box-shadow属性（从Willin大师的博客中发现的），此效果只能在Firefox中显示。
　　4.在博客副标题处添加了嘀咕消息显示，考虑到速度问题，嘀咕消息只显示在首页。
　　5.综上所述，现在博客在Firefox中显示是最完美的，哈哈。

　　再说下待修改的地方：

　　1.还未能解决文章标题再IE6下的显示缺陷，暂时只能做hack变动标题颜色。
　　2.未能解决已经成功发表过评论的评论者在下次评论时仍需重新输入姓名，电邮地址的问题。已经发现是缓存插件Hyper-Cache引起的，暂时禁用了。（表达的有点拗口）

　　唠叨结束，对于上面的两个问题，希望知道的大大能指点下，谢谢！

• 2009/11/05 -- 用jQuery隐藏回头访客资料输入框
• 2009/10/11 -- IE&Firefox Hack
• 2009/10/11 -- Gray&Green?
• 2009/09/09 -- 用WordPress做了一个微博

QQDrNetMon是干什么用的？能吃吗？
呃。。不能吃，它是用来监控计算机内所运行程序与互联网数据交换的速度与流量的，这么一句拗口的话可以简单理解为监控这些程序有没有偷偷的上传或下载数据。

QQDrNetMon的英文全称是什么呀？我在备考CET4，要抓住每一个学习的机会！
额，通过Google我知道了它的全称是QQ Doctor Net Monitoring。

QQDrNetMon需要安装吗？我最讨厌向注册表里面扔东西了！
恭喜你，它很符合你的胃口，解压后直接使用即可。（PS：对某些程序的监控可能要重启计算后才会生效。）

QQDrNetMon支持让我欢喜让我忧的Win7吗？Win7什么都好，就是对部分软件的兼容性不佳让我一直耿耿于怀。
再次恭喜你，在我32位的Win7 7600RTM上运行良好。

QQDrNetMon的原理机制是什么？我怎样才能确定我对某程序限制上传速度/禁止访问网络的操作已经生效了？
呃，作为一个写伪技术文章的blogger，我对它的原理机制还没弄懂，但是对于后面的问题，一个非常简单操作就能让你清楚，操作如下：

打开QQDrNetMon；运行一个浏览器程序；在QQDrNetMon里面找到浏览器的进程，如IE是iexplore.exe，Firefox的是firefox.exe；右键点击浏览器进程，选择禁止访问网络；再切回对应浏览器，访问个百度之类的服务器稳定、不存在被墙可能性的网站；如果发现网页打不开，那就证明QQDrNetMon已经在正常工作了。（PS：最后别忘记逆向操作一次。）

QQDrNetMon有什么实质用途呢？没实质用途的话那我可认为你是个蛋疼的人写了那么多的废话！
额，这东西可以让你了解为什么没下东西，但玩个游戏还会那么卡，看看是哪个程序正在偷偷上传吧，找到必须心狠手辣的把它咔嚓掉！

恩，你真好，谢谢你！要我怎么报答你呢？
呃，不谢～要感谢要报答去找原作者吧，再见！

什么？不给下载地址就休想逃掉？速度交出下载地址！

好汉饶命！地址在此：http://iskeee.googlecode.com/files/QQDrNetMon.rar （ps：顺便鄙视我们那伟大的墙不分青红皂白的把我一直用来当网盘的Google协作平台墙了。）
顺便附图一张：

相关文章还没诞生，先看看下面的吧

• 2009/04/13 -- 添加了Thread Twitter.
• 2009/04/12 -- Foxmarks升级至Xmarks.
• 2009/04/10 -- 感谢ExWebs.Org提供的博客空间.
• 2008/06/24 -- 推荐两个免费空间：000WebHost和心情休閒網的空间。

修改主题后，我发现了一个严重的问题，就是雅黑字体在IE7，IE8里面模糊的一塌糊涂，甚至不如宋体显示的效果好，而IE6很正常，在排除了字体大小等各种可能引发此现象的原因后，我找到了罪魁祸首——IE透明滤镜。

此时我的第一个反应就是给IE和Firefox做Hack，在网上翻了个遍后，找到了一段代码：

"\9"　例："margin:0px auto\9;"这里的"\9"能区分所有IE和FireFox；
"*"　IE6、IE7可以识别，IE8、FireFox不能；
"_"　IE6可以识别，E7、IE8、FireFox不能。

也就是说，我把字体的CSS写成这样的话：

body{
font:14px/160% 'Microsoft YaHei',Arial,宋体,Tahoma,Sans-Serif;
font:14px/160% Arial,宋体,Tahoma,Sans-Serif\0;
*font:14px/160% Arial,宋体,Tahoma,Sans-Serif;
_font:14px/160% Arial,宋体,Tahoma,Sans-Serif;
}


理论上字体在IE6，7，8里面都是显示宋体，而在非IE浏览器里面显示雅黑了，但理论终归理论，实际应用起来就出问题了，它在Firefox里面也显示宋体而没显示雅黑，真是各种诡异不断啊，最后又只能继续Google&Baidu，功夫不负有心人，我找到了一段使IE8强行使用IE7渲染网页的头部代码，柳暗花明了，在header.php里添加

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />

后，各种浏览器测试结果如我所愿。

今晚终于没有怀恨入睡了。。

最后附上一点资料：

关于IE Hack：http://bbs.blueidea.com/thread-2945721-1-1.html
关于使用IE滤镜后IE7，8中雅黑字体模糊：http://hi.baidu.com/icexile/blog/item/fe768f455897222ecffca39d.html

• 2009/11/05 -- 用jQuery隐藏回头访客资料输入框
• 2009/11/04 -- 博客主题再次修改
• 2009/10/11 -- Gray&Green?
• 2009/09/09 -- 用WordPress做了一个微博