博客冬眠段时间

  致各位有心无心点进我博客的朋友以及各让我头疼的自动或人工Spamer:最近由于各种原因无心折腾Wordpress了,貌似我去年也是这个时候暂时停止更新博客,好吧,你们可以理解成我冬眠去了,待明年春暖花开,我会回来的,谢谢各位点击!

利用jQuery实现文章部分内容收缩

  记得以前写过一篇名叫利用Collapsible Elements实现文章内容折叠效果的文章,当时Willin大师说过可以用jQuery来实现,无奈当时对jQuery毫无一点研究,只能硬着头皮用插件解决,这短时间稍微研究了下jQuery后,发现实现起来其实很简单,无非就是使用slideDown和slideUp俩函数,但下面代码和demo里面默认的是FadeIn和FadeOut两个函数,效果是渐显和渐隐,为什么不用收缩效果呢?因为在IE里面用收缩函数会不完美,在此再次鄙视IE。

  结合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.com/demo/demo2.html

  之前的代码如下: 继续阅读利用jQuery实现文章部分内容收缩

利用jQuery改变网页元素加载顺序

  在上一篇介绍副标题处显示嘀咕消息的文章中,我是把嘀咕的js放在header.php中,这是一个常规的方法,简单方便易实现,但这方法也存在一个很大的弊端,因为网页是按从上到下的顺序进行加载,引用了一段外部js在头部后,自己博客首页打开速度就会受到影响,还有就是在外部js失效后,博客首页也就会卡在那打不开了,极大的降低了访客体验度,有没有其他方法可以解决呢?

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

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

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

让你的Xmarks在天朝也能同步书签

  不知从何时开始,你会发现你的Xmarks同步书签无法完成,提示诸如连接被重置之类的信息,其实这是我们伟大的功夫网在作怪的原因,好了,不废话了,下面说应对方法。

  第一个方法是修改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在天朝也能同步书签

副标题处显示嘀咕消息

  也许观察仔细的童鞋早已发现我博客副标题旁的东西了,其实这就是一个嘀咕消息的显示,这篇文章就是告诉各位如何实现的,当然,是写给新手看的,高手们不要鄙视我。

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

嘀咕 (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),你跟随我之后我也会第一速度跟随你的。: )