织梦dedecms5.7文章内容图片太大页面错乱的解决方法

织梦dedecms5.7文章内容图片太大页面错乱的解决方法

第一个方法:通过css方法解决dede5.7图片大小问题

1.     img,a img{ 

2.     border:0;  

3.     margin:0;  

4.     padding:0; 

5.     max-width:590px; 

6.     width:expression(this.width>590?"590px":this.width); 

7.     max-height:590px; 

8.     height:expression(this.height>590?"590px":this.height); 

9.     }

复制代码

上面的代码有2个问题!
1.会把图片变的非常小。要刷新一次才能正常显示!
2.图片不会按比例缩小,图片严重变形!
代码如下:

1.     <!-- Begin CSS 控制图片大小 -->

2.     <style type="text/css"> 

3.     <!-- 

4.     img,a img{ 

5.     border:0;  

6.     margin:0;  

7.     padding:0; 

8.     max-width:650px; 

9.     width: expression(this.width > 650 && this.width > this.height ? 650px : 'auto';);  

10. max-height:1650px; 

11. height: expresion(this.height > 1650 ? 1650px : 'auto';); 

12. } --> 

13. </style>

14. <!-- End CSS 控制图片大小 -->

复制代码

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

在dede模板的内容页面底部插入代码,必须在 “<div id=article>   这里是文章正文  </div>” 后面,</body>前面

1.     <script type="text/javascript" >

2.      

3.     //缩放图片到合适大小

4.     function ResizeImages()

5.     {

6.        var myimg,oldwidth,oldheight;

7.        var maxwidth=550;

8.        var maxheight=880

9.        var imgs = document.getElementById('article').getElementsByTagName('img');   //如果你定义的id不是article,请修改此处

10.  

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

12.      myimg = imgs[i];

13.  

14.      if(myimg.width > myimg.height)

15.      {

16.          if(myimg.width > maxwidth)

17.          {

18.   oldwidth = myimg.width;

19.   myimg.height = myimg.height * (maxwidth/oldwidth);

20.   myimg.width = maxwidth;

21.          }

22.      }else{

23.          if(myimg.height > maxheight)

24.          {

25.   oldheight = myimg.height;

26.   myimg.width = myimg.width * (maxheight/oldheight);

27.   myimg.height = maxheight;

28.          }

29.      }

30.    }

31. }

32. //缩放图片到合适大小

33. ResizeImages();

34. </script>

35.  

复制代码

也可将上面的代码保存为一个js文件,放在网页底部调用。其中 ResizeImages();  表示执行,缺少这段代码则程序不执行。





      

关于本文的作者 :

     名字很酷,据说爱软件,爱网络,爱游戏,爱数码,爱科技,各种控,各种宅,不纠结会死星人,不折腾会死星人。此人属虚构,如有雷同,纯属被抄袭……

 

下面是我的联系方式:

     大家有事没事就骚扰一下我吧,只不过我经常忙不过来,不一定能很快回复你的邮件,希望别介意…… 下面是一些我主要的联系方式,你可以根据自己的情况收听它们,它们都会同步更新的!

  新浪微博 | 腾讯微博 | 河南论坛 | 河南健康网 | 博客园

pasting

你可能感兴趣的:(织梦dedecms5.7文章内容图片太大页面错乱的解决方法)