织梦dedecms让文章的大图片不损坏结构

阿奇源码默认解压密码为"www.aqiyuanma.com",2021年9月11日前的源码默认解压密码为"www.hnymwl.com"
阿奇官方VIP技术群:483386718,阿奇源码技术交流群:938992858!速奇云-香港云服务器38元/月

  信托许多同伙,都曾遇到过,揭晓一篇通俗文章,若是图片宽度跨越内容区域巨细,图片就会把表格撑大,打乱面页的结构,懂CSS的同伙能会通过css来界说,让超出的部门隐藏起来,但这样,图片的雅观性就很差,显示不出来超出的部门。

  论坛中另有一些同伙,用css方式,当图片过大后,将图片自动缩小,然则我试过,由于CSS对各个浏览器存在兼容问题,我在IE6下测试,一点作用也没有。下面
织梦学习网给人人先容一下我在DEDECMS里的方式(不用修改源程序,只需要在模板里使img加上JS控制代码,然后将原始图片等比例缩小)。

  第一步:

  在img加上便签,还要去掉height属性。

  修改内容页模板的{dede:field.body /}为

{dede:field.body runphp='yes'}
$content = @me;
$mode1 = "/<img/";
$mode2 = "/height=\"(\d+)\" /";
$str1 = "<img onload=\"javascript:ImgReSize(this)\"";
$content = preg_replace($mode1,$str1,$content);
$content = preg_replace($mode2,"",$content);
@me = $content;
{/dede:field.body}

 
 第二步:

  将下面代码插入到<head></head>中,注重谁人670的数值,这个值意思是当图片跨越这个数值,自动将图片缩小,宽度缩小为670,高度自动按比例缩小,这样不会变型。

<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最好找到对应的CSS,将它的宽设定好,然后界说一下,超出部门隐藏,由于有时刻,文章在加载的历程中,显示的是你原始巨细,加载完成后,JS才会起作用,将图片缩小。

收藏 (0) 打赏

感谢您的支持,我会继续努力的!

打开微信/支付宝扫一扫,即可进行扫码打赏哦,分享从这里开始,精彩与您同在
点赞 (0)

注:在使用本系统时,使用方必须在国家相关法律法规范围内并经过国家相关部门的授权许可,禁止用于一切非法行为。使用用途仅限于测试、实验、研究为目的,禁止用于一切商业运营,本团队不承担使用者在使用过程中的任何违法行为负责。

阿奇源码 DEDECMS教程 织梦dedecms让文章的大图片不损坏结构 https://www.aqiyuanma.com/109979.html

相关文章

官方客服团队

为您解决烦忧 - 24小时在线 专业服务

  • 0 +

    访问总数

  • 0 +

    会员总数

  • 0 +

    文章总数

  • 0 +

    今日发布

  • 0 +

    本周发布

  • 0 +

    运行天数

你的前景,远超我们想象
织梦dedecms让文章的大图片不损坏结构-海报

分享本文封面