Question

这是我关于SO的第一篇文章： - ）

我遇到了让MooTools变身为CSS类的问题。我很确定我已经按照文档和演示进行了操作，但是当我调用myElement.morph('.hover')时，它不会变身为.hover类。我的设置如下：

的index.html：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <link rel="stylesheet" href="style.css" />
    <script src='mootools.js' type="text/javascript"></script>
    <script src='hover.js' type="text/javascript"></script>
</head>
<body>
    <div class="btn"></div>
</body>
</html>

hover.js：

window.addEvent('domready', function() {
    var myElement = $$('.btn')[0];
    myElement.morph('.hover');                           // This doesn't work
    //myElement.morph({ 'background-color': '#009' });   // This works
    //myElement.set('class', 'hover');                   // This also works
});

的style.css：

.btn {
    width: 200px;
    height: 100px;
    background-color: #999;
}
.hover {
    width: 200px;
    height: 100px;
    background-color: #009;
}

我找到someone with a related problem，但.hover是我的选择器的全名...所以我很难过。

提前感谢您的帮助！

Answer 1

这不起作用，因为有一个错误：https://mootools.lighthouseapp.com/projects/2706/tickets/1063-no-class-morphing-with-13-no-compat

修复的里程碑：1.3.1（很快） - 或者您可以从github上的1.3.1分支获取Element.Style.js补丁。

Answer 2

Mootools 1.3 Core（非compat）似乎有错误。

如果您在above Fiddle中选择了非compat版本，则会收到以下错误：Element.Styles.each is not a function。

解决方案可能是切换到MooTools Core 1.3 with compatibility。

（似乎Styles类中的属性Element从1.3开始不再存在。

Answer 3

只差我2美分。不应该是这样的：http://jsfiddle.net/3wKhN/

为什么这个MooTools不变形（'。some-class'）;功能工作？

3 个答案: