• 全国400电话网上服务平台
    强大号码库资源任选,方便,快捷,快速开通。
    咨询热线:400-1100-266  

    二种方法解决织梦DedeCMS文章图片太大撑破内容页
    POST TIME:2017-11-13 01:34

    第一个方法:通过css方法解决:

    CSS样式如下:

    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.图片不会按比例缩小,图片严重变形!

    演示如下如下:

    <!– Begin CSS 控制图片大小 –>
    <style type=”text/css”>
    <!–
    img,a img{
    border:0;
    margin:0;
    padding:0;
    max-width:650px;
    width: expression(this.width > 650 && this.width > this.height ? 650px : ‘auto';);
    max-height:1650px;
    height: expresion(this.height > 1650 ? 1650px : ‘auto';);
    } –>
    </style>
    <!– End CSS 控制图片大小 –>

    第二种:通过JS来限制图片大小

    在dede模板的内容页面底部</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>

    这样就可以了

    
    Copyright © 2003-2016
    时间:9:00-21:00 (节假日不休)
    版权所有:巨人网络(扬州)科技有限公司
    总部地址:江苏省信息产业基地11号楼四层
    《增值电信业务经营许可证》 苏B2-20120278
    X

    截屏,微信识别二维码

    微信号:veteran88

    (点击微信号复制,添加好友)

     打开微信

    微信号已复制,请打开微信添加咨询详情!