Question

我需要对需要使用IE 7/8的脚本中的图像使用maxWidth和maxHeight。由于IE不支持这些CSS规则，我编写了以下函数：

function maxDimensions(element, maxWidth, maxHeight)
{
    element.style.width = 'auto';
    element.style.height = 'auto';
    element.style.width = maxWidth;
    var ht = element.innerHeight ? element.innerHeight : element.clientHeight;
    if (ht > maxHeight)
    {
        element.style.width = 'auto';
        element.style.height = maxHeight;
    }
}

然而，这似乎无声地失败并且根本没有调整某些图像的大小，而在其他图像上工作完全正常。是否有“接受”的方式在IE中完成此操作？我的代码有什么明显的错误吗？

Answer 1

您可以使用CSS表达式在IE6中模拟maxWidth和maxHeight - 例如http://www.cameronmoll.com/archives/000892.html。确保有条件地将这些规则应用于仅针对IE6，并记住CSS表达式存在一些重大性能问题。

Answer 2

使用jQuery和jQMinMax插件。

编辑：OP已经添加了这是一个书签，所以在这种情况下这不起作用。

Answer 3

我最终在我发布的代码中找到了错误：

element.style.width = maxWidth;

应该阅读

element.style.width = maxWidth+"px";

（类似于style.height）。因此，问题的功能应为：

function maxDimensions(element, maxWidth, maxHeight)
{
    element.style.width = 'auto';
    element.style.height = 'auto';
    element.style.width = maxWidth+"px";
    var ht = element.innerHeight ? element.innerHeight : element.clientHeight;
    if (ht > maxHeight)
    {
        element.style.width = 'auto';
        element.style.height = maxHeight+"px";
    }

}

这现在有效。但是，我现在暂时打开这个问题，万一有人有一个更简单的解决方案。

Javascript：在IE中模拟图像的maxWidth和maxHeight

3 个答案: