小技巧:让文章的大图片不破坏布局

下面给大家介绍一下我在DEDECMS里的方法(不用修改源程序,只需要在模板里使img加上JS控制代码,然后将原始图片等比例缩小)。

解决页面出现图片过大、撑破表格或不显示超出部分图片的问题

相信很多朋友,都曾遇到过,发表一篇普通文章,如果图片宽度超过内容区域大小,图片就会把表格撑大,打乱面页的布局,懂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,需要批量修改,可以用到如下方法1。 1、在数据库里运行下面的代码就可以了,文章的点击量变得随机从500到1000 UPDATE dede_archives SET click=FLOOR(500 + (RAND() * 1000))
用织梦Dedecms建站网站修改的时候,建议优化系统默认的URL结构,这样能简化网站目录深度,利于搜索引擎收录。 现在织梦的默认文章命名规则是: {typedir}/{Y}{M}/{D}/{aid}.html {typedir}代表的是上级目录 如我的网站http://www.xxx.com/ 按照织梦默认的命
织梦会员中心发布文章自动过滤外部外部链接,保留本站站内链接。这个织梦默认后台本身带有这样的功能的,只是会员模块里没有而已。 我们可以把功能嫁接到会员模块里去使用,实现自动过滤外部链接 实现教程: 打开 /member/inc/inc_archives_functions.php 在
我们有时候需要调用body中的任意一张图片,这样要怎么操作呢?大家都知道,调用全部文章内容我们用以下标签: {dede:field.body/} 调用内容里面的第一张图片,我们可以用正则表达式的方式进行调用 (在这里注意,调用时候,要保证你body中至少插入了一张图片
打开文件 /dede/inc/inc_archives_functions.php 1、在最后增加方法 /*火车头采集自动更新主页*/ function MakeIndex() { global $dsql,$cfg_basedir,$cfg_templets_dir,$cfg_df_style; require_once(DEDEINC./arc.partview.class.php); $envs = $_sys_globa
在管理文章或软件的时候,大家在添加关键字和内容摘要的时候,是不是对这样的情况感到比较的郁闷,我的关键字设定的明明非常的好,可是添加或修改后,会被无缘无故的截去很多,想必大家也都非常的明白,文章的关键字和内容摘要,对文章是至关重要的,您是不