Drupal 7 建站学习手记（四）：修改Nivo Slider模块的宽高

<code>nivo slider</code>模块默认大小是用的<code>height: 100%, width 100%</code>，

但ie7及以下的浏览器是不支持百分比宽高的，

而我的项目目标用户基本都是使用xp系统，项目需求是必须兼容ie7。

因此需要对其css修改成绝对像素大小。

修改之后却出现了问题，因为用户上传的图片长宽比是不一样的，

指望用户每次上传的时候先用ps裁剪一下明显不现实，

于是我在css里将其拉伸了，这样就不会导致图片只显示一部分。

但是，<code>nivo slider</code>在每次幻灯片切换前图片都会变成未拉伸的状态。

幻灯片切换的时候就会感觉图片在“跳动”。

明明已经写死了<code>img</code>的宽高，为什么切换前会变回来呢？

初步断定是因为<code>nivo slider</code>模块在控制切换的js里有改变图片的宽高。

翻了一下<code>nivo slider</code>模块的js，发现是压缩过的，改起来比较麻烦。

于是又祭出万能的css大法了！- -！

仔细分析后，发现js是在改变<code>img</code>元素的<code>height</code>属性

我们可以用<code>min-height</code>和<code>max-height</code>属性让<code>height</code>的改变无效：

问题解决！

本文首发，转载请注明。