闫学坤博客
微信关注，获取更多 用Dedecms程序搭建的网站，发表文章，或者采集过来的文章，图片往往会太大，超过了容纳内容的框架，从而导致页面混乱。懂CSS的朋友估计会给内容页的图片设定一个宽度值，但是这样的话采集过来的小张图片会随着这个设定的值而变大，图片就会变得模糊了；网上其他网友分享的方法，很多都只是把宽度缩小，而高度没有按比例缩小，那么这种情况就会造成图片变形了，特别是对一些比较长的图片，就会变形很厉害了。
那么我们能不能既缩小宽度，又让高度按比例自动缩小，保持图片的美观性呢？答案当然是可以的，下面我们就来介绍一下方法：
首先，我们找到 include/arc.archives.class.php 文件找到下面的代码：
- //设置全局环境变量
- $this->Fields[‘typename’] =
- $this->TypeLink->TypeInfos[‘typename’];
- @SetSysEnv($this->Fields[‘typeid’],$this->Fields[‘typename’],$this->Fields[‘id’],$this->Fields[‘title’],’archives’);
复制代码
在下面加入以下代码：
- //替换图片Alt为文档标题
- $this->Fields[‘body’] =
- str_ireplace(array(‘alt=””‘,’alt=\’\”),”,$this->Fields[‘body’]);
- $this->Fields[‘body’]
- = preg_replace(“@
- [\s]{0,}alt[\s]{0,}=[\”‘\s]{0,}[\s\S]{0,}[\”‘\s]
- @isU”,”
- “,$this->Fields[‘body’]);
- $this->Fields[‘body’] =
- str_ireplace(“<img ” ,”<img
- //img标签中加入超宽缩小JS调用代码
- $suolue=’onload=”javascript:ImgReSize(this)”‘;
- $this->Fields[‘body’]
- = str_ireplace(“<img ” ,”<img “.$suolue.”
- “,$this->Fields[‘body’]);
- //屏蔽height属性
- $this->Fields[‘body’] =
- preg_replace(‘/<img(.+?)height=(.+?)
- (.+?)>/i’,”<img$1$3>”,$this->Fields[‘body’]);
复制代码
第二步：打开你前台文章页模版 默认的是：/templets/default/article_article.htm (有的朋友，仿完站，内容页的模版未必是这个默认的)打开模版后将下面代码插入到<head> </head> 中 ，注意那个670的数值，这个值意思是当图片超过这个数值，自动将图片缩小，宽度缩小为670，高度自动按比例缩小，这样不会变型。
- <script language=’javascript’>
- function
- ImgReSize(e)
- {
- if(e.width>670) //
- 670可根据你文章的内容区域大小，可调整
- {
- e.width=670; //
- 等同上面你设的那个数值
- e.style.width=””;
- }
- if(e.height>10)
- {
- e.style.height=””;
- }
- }
- </script>
复制代码
到这里，就设定完了，去后台生成一下所有的文章，就可以把内容页的图片自动缩小了。如果你懂CSS最好找到 内容区域的CSS，将它的宽设定好，然后定义一下，超出部分隐藏，因为有时候，文章在加载的过程中，显示的是你原始大小，加载完成后，JS才会起作用，将图片缩小。
