第一个方法:通过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(); 表示执行,缺少这段代码则程序不执行。
关于本文的作者 :
下面是我的联系方式:
大家有事没事就骚扰一下我吧,只不过我经常忙不过来,不一定能很快回复你的邮件,希望别介意…… 下面是一些我主要的联系方式,你可以根据自己的情况收听它们,它们都会同步更新的!
新浪微博 | 腾讯微博 | 河南论坛 | 河南健康网 | 博客园