首页 > CMS > 织梦DEDE > 正文

Dedecms织梦缩略图完美优化

2024-07-12 09:11:34
字体:
来源:转载
供稿:网友
相信很多织梦dedecms 站长都在头痛如何处理缩略图的问题吧。织梦dedecms系统默认是将缩略图缩小为小于等于后台设置的尺寸。
     
因为原图片的尺寸都是不一样的,如果前台是固定图片框显示,那么一定显示不好看。图片会变形。因此,很多站长为了dedecms 网站美观,就手动修改。

想想这工程浩大啊。
     
那么有什么既方便又实用的办法呢?
 
Abing给出的优化方案是这样的:
1、在后台设置缩略图尺寸,设置成前台最大固定框的尺寸。
2、使织梦提取的缩略图大于等于后台设置的尺寸,也就是将原图等比例缩小成不是宽等于设置尺寸就是高等于。
3、编写JS函数,前台显示缩略图的时候,使图片总是水平垂直显示,DIV不被撑开。
这个应该是综合最优的方案了,而且一次搞定终身受益。下面我就把详细教程贴出来。
 
第一步:
后台设置缩略图大小。
 
 
第二步:修改image.helper.php页面
if($toWH<=$srcWH){$ftoW=$toW;$ftoH=$ftoW*($srcH/$srcW)}else{$ftoH=$toH$ftoW=$ftoH*($srcW/$srcH)}
 
将if与else中的代码互换。
 
 
 
第三步:
编写一个JS函数。
 
function ImageShow(maxWidth,maxHeight,objImg){var img=new Image();img.src=objImg.src;var w=img.width;var h=img.height;if(w==maxWidth&&h==maxHeight){objImg.width=maxWidth;objImg.height=maxHeight;return};var b1=w/h;var b2=maxWidth/maxHeight;if(b1>b2){objImg.height=maxHeight;objImg.width=maxHeight/h*w;objImg.style.marginLeft=-(maxHeight*w-maxWidth*h)/(2*h)+'px'}else{objImg.widt=maxWidth;objImg.height=maxWidth/w*h;objImg.style.margnTop=-(maxWidth*h-maxHeight*w)/(2*w)+'px'};return};
 
第四步:
CSS,图片所在DIV,设置成图片要显示的宽和高,然后增加“voerflow:hidden”
图片显示调用上面的JS函数,具体如下:
<img onload="ImageShow(宽,高,this)" src="图片地址" />
 
只要这样四步,就完美搞定缩略图问题啦。
发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表