二种方法解决DEDECMS图片大小图片太大撑破内容页-巨人网络

主页 > 网站建设 > 建站知识 > 二种方法解决DEDECMS图片大小图片太大撑破内容页

二种方法解决DEDECMS图片大小图片太大撑破内容页

POST TIME:2020-04-04 16:14

工业环保工程类企业网站织梦模板(带手机端)

html5响应式网站织梦模板源码IT网络工作室织梦网

蓝色安防器材公司类整站模板

软件APP类网站源码织梦通用型企业网站源码html

第一个方法：通过css方法解决dede5.7图片大小问题
img,a img{
border:0;
margin:0;
padding:0;
max-width:590px;
width:expression(this.width>590?"590px":this.width);
max-height:590px;
height:expression(this.height>590?"590px":this.height);
}
上面的代码有2个问题！
1.会把图片变的非常小。要刷新一次才能正常显示！
2.图片不会按比例缩小，图片严重变形！
代码如下：


<style type="text/css">

</style>

第二种：通过JS来限制图片大小
在dede模板的内容页面底部插入代码，必须在 “<div id=article> 这里是文章正文</div>” 后面，</body>前面

<script type="text/javascript" >

//缩放图片到合适大小
function ResizeImages()
{
var myimg,oldwidth,oldheight;
var maxwidth=550;
var maxheight=880
var imgs = document.getElementById('article').getElementsByTagName('img'); //如果你定义的id不是article，请修改此处

for(i=0;i<imgs.length;i++){
myimg = imgs;

if(myimg.width > myimg.height)
{
if(myimg.width > maxwidth)
{
oldwidth = myimg.width;
myimg.height = myimg.height * (maxwidth/oldwidth);
myimg.width = maxwidth;
}
}else{
if(myimg.height > maxheight)
{
oldheight = myimg.height;
myimg.width = myimg.width * (maxheight/oldheight);
myimg.height = maxheight;
}
}
}
}
//缩放图片到合适大小
ResizeImages();
</script>