解决DEDE页面图片过大的问题
两种方法完美解决dede内容页面图片过宽撑破表格的现象
第一种就是在CSS的viewbox标签下规定最大宽度,如下代码:
1 2 3 4 5 6 7 |
.viewbox img{ max-height:500px; max-width:680px; width:expression((this.width > 680 && this.width > this.height) ? '680px': this.width+'px'); height:expression((this.height > 500 && this.height > this.width) ? '500px': this.height+'px'); float:middle; } |
第二种稍微麻烦些,需要通过JS来重写宽度,方法如下:
1、打开include/arc.archives.class.php
1 2 3 |
//设置全局环境变量 $this->Fields['typename'] = $this->TypeLink->TypeInfos['typename']; @SetSysEnv($this->Fields['typeid'],$this->Fields['typename'],$this->Fields['id'],$this->Fields['title'],'archives'); |
加入代码:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
//替换图片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 alt=\"".$this->Fields['title']."\" ",$this->Fields['body']); //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']); |
2、打开你前台文章页模版 默认的是:/templets/default/article_article.htm
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
<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方法为先。
版权声明:
作者:心飞翔
链接:https://www.faystar.com/uncategorized/1188.html
来源:心飞翔
文章版权归作者所有,未经允许请勿转载。
THE END
0
二维码
海报
解决DEDE页面图片过大的问题
两种方法完美解决dede内容页面图片过宽撑破表格的现象
第一种就是在CSS的viewbox标签下规定最大宽度,如下代码:
……
共有 0 条评论