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();
this.fixed=false;
}
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()
{
if (! this.fixed)
{
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);
}
});
this.fixed=true;
}
}
}
}
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.
Comments (14)
右边的边栏字体Size傲娇了呢~WWwwWWWwwww
应该是cache的原因,理论上强制刷新下就好了。
我这显示是正常的,safari/ff/chrome
不满意要投诉哦~WWwwwwWWWwwww
喂喂,哪里有H口牙[:shock]
[:otz][:cry]太暴力了[:locked]
话说今天好热啊,受不鸟鸟~30多度的~[:bye]
打开这里好慢……
打开这里好慢……
JS除了这2个方法外貌似没其他的线程类函数了,各种纠结。
@兰色忧郁:
偶这里前后一个月经历了从28度跌到8度,又回温到20度,跟坐过山车一样,特刺激...
@Mucid:@Mucid:
11区的server貌似对网通友好点,电信可能差点。
@自贡SEO:
有问题尽管提吧>_<,虽然我也是小白
@Maid:
其实这代码也只是为了包装下保证能重复利用,如果简单的写的话也就是8,9行的样子。
@kita:
mld我一直不喜欢用,电驴之前一直用的amule,现在基本都扔离线了.....
Leave a comment