Added:
1:Sidebar RecentPost
2:Sidebar Blogroll
Fixed:
1:评论内图片宽度超过固定宽度
没什么复杂的东西，不过这个snippet或许发出来有人能用到。
Dependency:
1:jQuery
2:jQuery Lightbox
Function:
1:传入一个jQuery提取的图片对象 如 $('img') 后，对该图片数组进行分析，若图片宽度超过固定大小后则修改图片宽度到固定值，并将该节点包装入一个lightbox中，使得可浏览正常尺寸。
Demo:
Code:
CustomImage=function(jquery_pic_instance)
{
this.fitWidth=450;
this.toBeFixedPics=jquery_pic_instance;
this.resizeCommentPic();
}
CustomImage.prototype={
testCommentPic : function()
{
var picReady=true;
$.each(this.toBeFixedPics,function(i,pic)
{
var flag=false;
if (pic.width>0)
{
flag=true;
}
picReady= flag && picReady;
});
return picReady;
},
wrapWithLightbox : function(img_dom)
{
var tempNode=$('<a rel="lightbox" title=""></a>');
tempNode.append($(img_dom).clone());
tempNode.attr('href',img_dom.src);
$(img_dom).replaceWith(tempNode);
tempNode.lightBox();
},
resizeCommentPic : function()
{
var ci=this;
flag=this.testCommentPic();
if ( ! flag )
{
setTimeout(function(){
this.resizeCommentPic();
},100);
}
else
{
$.each(this.toBeFixedPics,function(i,pic)
{
var w=ci.fitWidth;
var ratio= pic.height/pic.width;
var flag = ci.fitWidth < pic.width;
if ( flag )
{
pic.width = ci.fitWidth ;
pic.height = ci.fitWidth * ratio ;
ci.wrapWithLightbox(pic);
}
});
}
}
}
How to use:
在jQuery加载函数中加入如下代码：
其中toBeFixed是要控制的图片对象，FixImage是新建的CustomImage对象。
$().ready(function(){
var toBeFixed=$('#comments').find('img').not('.smiley').not('.avatar');
FixImage=new CustomImage(toBeFixed);
});
Sum up:
1:很简单的一段代码，不过有个地方调错浪费了我不少时间。就是setTimeout这个函数，最初传入的setTimeout(this.resizeCommentPic,100);却提示空指针，于是反映过来——setTimeout是一个全局函数，this指向的window,所以需要传入一个闭包匿名函数，将私有变量传入。也就是写成如下的形式：
setTimeout(function(){
this.resizeCommentPic();
},100);
就可以解决问题。
P.S.:明天8点半起来围观刑场，虽言胜败乃兵家常事，不过明天是输不起的一场比赛。Sometimes we must bite the bullet.
