关键字描述:最大 图片 控制 &nbsp 这个 var // 宽度 maxwidth if

科汛CMS官方模板中自带了一段JS用来控制文章中的图片的最大高度和宽度。不过我也很奇怪,为什么这个js有时候好用有时候并不好用,这个问题我研究了很久,不得而终。

//改变图片大小

function resizepic(o)

{

var maxwidth=550; //定义最大宽度

var maxheight=800; //定义最大高度

var a=new Image();

a.src=o.src

if(a.width > maxwidth)

{

o.style.width=maxwidth;

}

if (a.height> maxheight)

{

o.style.height=maxheight;

}

}

//无级缩放图片大小

function bbimg(o)

{

var zoom=parseInt(o.style.zoom, 10)||100;

zoom =event.wheelDelta/12;

if (zoom>0) o.style.zoom=zoom '%';

return false;

}

今天,又一个模板怎么着这段js都不起作用,没办法,百度了一下,找到一段CSS可以完美解决这个问题。不敢独享,特发上来与大家一同分享。

CSS代码如下:

#Article_Content img {width: expression(this.width > 560 ? 560: true); max-width: 560px;}

其中#Article_Content 改成你的文章内容处使用的div 的id 其中“560”改成你需要的宽度。

IE测试通过。火狐2测试通过。

说明,鼠标滚动自动缩放图片用这个css是无法做到的。不过这个功能基本没用。

科讯首页css,科讯CMS纯CSS控制图片最大宽度相关推荐

  1. [css] 能不能使用纯css使你的浏览器卡死?怎么实现?

    [css] 能不能使用纯css使你的浏览器卡死?怎么实现? 可以,用计算属性calc,变量 个人简介 我是歌谣,欢迎和大家一起交流前后端知识.放弃很容易, 但坚持一定很酷.欢迎大家一起讨论 主目录 与 ...

  2. CSS 魔法系列:纯 CSS 绘制各种图形《系列五》

    我们的网页因为 CSS 而呈现千变万化的风格.这一看似简单的样式语言在使用中非常灵活,只要你发挥创意就能实现很多比人想象不到的效果.特别是随着 CSS3 的广泛使用,更多新奇的 CSS 作品涌现出来. ...

  3. html5制作天气动画背景,CSS icon图标之纯CSS实现带动画效果的天气图标

    CSS3动画属性并不是很多,但重点其实是你怎样去运用它,从简单的hover状态或复杂的小动画,都可以巧妙的用CSS3动画属性来实现. 今天主要是和大家分享一个比较有创意.实用的CSS天气图标动画,静态 ...

  4. css动画怎么暂停,纯CSS方式实现CSS动画的暂停与播放!

    使用纯 CSS 的方法,能否暂停.播放 CSS 动画?看起来不可能,至少很麻烦. 我们知道,在 CSS3 animation 中,有这样一个属性可以暂停.播放动画: { animation-play- ...

  5. html按钮按下效果_【CSS小分享】纯CSS实现一个水波纹效果按钮

    前言 如果大家有用过Material Design风格的UI库,那么一定对水波纹按钮很熟悉,我们这次就是使用纯CSS实现一个最简单的水波纹效果按钮,先上成品: 原理 在按钮中放置一个默认隐藏径向渐变的 ...

  6. CSS 魔法系列:纯 CSS 绘制基本图形(圆、椭圆等)

    我们的网页因为 CSS 而呈现千变万化的风格.这一看似简单的样式语言在使用中非常灵活,只要你发挥创意就能实现很多比人想象不到的效果.特别是随着 CSS3 的广泛使用,更多新奇的 CSS 作品涌现出来. ...

  7. html css 水平时间轴,纯css+js水平时间轴

    自定义,并自动加载时间节点 当前时间节点居中,突出显示 时间动态无痕添加 效果图: 初始状态 时间左走到一定2016.1月后 html: + - 对应 JS 设置处理: var left = docu ...

  8. html css字幕滚动代码,纯CSS实现滚动3D字幕

    一直以来我都想做一个滚动文本的效果,虽然有几种方法实现,其中还有使用WebGL的方法.但我还是想使用HTML和CSS来实现这样的效果. 很多年以前,在Web上实现滚动文本的动画效果一般是采用marqu ...

  9. css空心三角形_纯CSS制作空心三角形和实心三角形及其实现原理

    纯CSS制作空心三角形和实心三角形及其实现原理 在一次项目中需要使用到空心三角形,我瞬间懵逼了.查阅了一些资料加上自己的分析思考,终于是达到了效果,个人感觉制作三角形是使用频率很高的,因此记录下来,供 ...

  10. css三实现ui,纯CSS实现常见的UI效果

    原标题:纯CSS实现常见的UI效果 转自:掘金 - alphardex 前言 切图仔,是大多数前端用来自嘲的称呼.相信很多人平时写页面的时候,大部分时间是在切图和排图,如此往复.这里并不是要否定切图本 ...

最新文章

  1. python 归一化_几种归一化方法(Normalization Method)python实现
  2. beangle commons 4.0.0 release
  3. 开源项目kcws代码分析--基于深度学习的分词技术
  4. wxpython制作表格界面_wxpython入门第二步(布局)
  5. 填坑-十万个为什么?(13)
  6. AsyncTask的基础讲解
  7. JDK 9/10/11:Java字符串上+ =带来的副作用
  8. php冒泡 插入选择 排序,说说PHP数组的三种排序(冒泡/选择/插入)方法
  9. properties文件 , properties类, 的作用
  10. 数据结构之排序算法Java实现(2)——选择类排序之堆排序算法
  11. Linux查看kvm安装路径,Linux系统KVM虚拟化自动部署
  12. 大厂难进,Java面试该如何一面即中?
  13. 制作U盘启动的并可保持更改更新和设置的BT4最终版完全手册
  14. 一元钱一瓶汽水,喝完后两个空瓶能换一瓶汽水,问:你有20元钱,可以喝到几瓶汽水?
  15. 1.firefox缺少flash插件
  16. 带有en的单词有哪些_英语前缀大全en:开头是EN的单词有哪些
  17. dropbox for android,Dropbox
  18. Google 回归中国,你准备好成为 Googler 了吗?
  19. 文献综述在哪儿能找到?
  20. Win11宽带连接错误651如何解决?

热门文章

  1. (转)名企工资一览表 更加明确 自己的目标。
  2. LCD的poll和vcom的反馈调节
  3. python捕获异常 主动抛出异常
  4. Adobe XD 好用的插件我推荐这 10 个!
  5. vue h5 端实现富文本图片预览(基于 Vant UI 的 ImagePreview 组件)
  6. 阿里巴巴NLP算法面试题整理
  7. 基于SSM在线考试系统的核心功能之一自动组卷的实现 SpringBoot版本
  8. string 函数 java_Java String 常用函数
  9. 数字化转型 — 新能源汽车 — 生产制造流程 — 三电车间
  10. 私有网盘部署-Cloudreve网盘