Mootools 1.2.5 Element.setStyle / Morph答案

【问题标题】：Mootools 1.2.5 Element.setStyle / MorphMootools 1.2.5 Element.setStyle / Morph
【发布时间】：2010-12-08 15:52:48
【问题描述】：

我最近为我的网站制作了一个 Mootols 脚本。使用 Fx.Morph，我成功地创建了我想要的效果。但是，该脚本在 Internet Explorer 7 和 8 中失败（在 9 中运行良好，没有费心检查 IE6）。我正在使用 mootools 1.2.5。

挖掘问题，我可以弄清楚以下内容

现在，我通过在 Mootools 核心的 setStyle 函数中执行以下操作来“修补”错误：

if((Browser.Engine.trident && value[0] == '-' && (property == 'height' || property == 'width')) || value[0] == 'N')
    value='0px';

谁有更多关于这个问题的信息或遇到过类似的问题？

【问题讨论】：

请分享变形代码，或者更好的是，访问 www.jsfiddle.net 并构建一个可以破解的工作示例。根据经验，如果 IE 为错误的属性获取错误的值，它会抛出一个不稳定的问题，如果你说，你可以可靠地检查，做 element.setStyle("scroll", "none"); 这适用于其他浏览器。在 IE 中具有负高度听起来是一件坏事。仅供参考，这也是 jquery 中的一个问题 - bugs.jquery.com/ticket/5588 - 构建测试用例，我会看看我能做什么

【解决方案1】：

Morph 似乎并不关心它是否要使用无效的属性/值组合调用 setStyle，而 setStyle 也不关心它是否要为指定的属性设置无效值。

考虑到这一点，我的问题来自我使用的效果。我正在使用诸如“Bounce.easeIn”之类的元素，该元素必须将高度从 0px 变形为 160px。然后，Morph 将使用负值调用 setStyle。

在我的情况下，将效果设置为“线性”使其按预期工作。

在我看来，Morph 应该“知道”它将要做什么，并防止使用无效值调用 setStyle。当使用不可能的属性/值而不是让浏览器崩溃/处理问题时，Element.setStyle 也应该引发错误。我看看 1.3 有没有解决这个问题，如果没有，请开票。

【讨论】：

不会发生。这意味着每个浏览器都有一个有效的正则表达式，它包含您传递的每个可能属性的每个可能值。该框架不应该是对浏览器进行傻瓜验证的框架，它只是一个 API，最终 Web 开发人员有责任只传递有效且有意义的框架。
我理解你的观点，关于 setStyle。但是，根据 W3C，具有负尺寸的框是无效的。 Morph 不应该试图创建一个无效的盒子。我知道 IE 是在这种情况下唯一崩溃的浏览器，而我测试的其他浏览器只是忽略了这一点。我今天还有另一个问题，我将“NaNpx”发送到 setStyle。没有浏览器抱怨除了 IE。在我看来，每个浏览器都应该崩溃，因为这显然是一个重大错误。
问题在于弹性过渡超出了目标数量并返回，真的。然而，过渡是普遍的，它们在数字之间过渡，并且将该过渡应用于变形高度是次要的。如果transition: Browser.Engine.trident && Browser.version < 9 ? somethingelse : bouncin, - btw 检查浏览器对象是小写还是大写 V，我会简单地去
你也可以添加一个try / catch块（如果IE使用$try）