CODEWITHSUNDEEP
javascriptmootools
user617707
user617707

Reputation: 13

Why isn't this MooTools morph('.some-class'); function working?

this is my first post on SO :-)

I'm having a problem getting MooTools to morph to a CSS class. I'm pretty sure I've followed the docs and demo, but when I call myElement.morph('.hover') it will not morph to the .hover class. My setup is as follows:

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;
}

I found someone with a related problem, but .hover is the full name of my selector...so I'm stumped.

Thanks in advance for any help!

Upvotes: 1

Views: 1145

Answers (3)

Dimitar Christoff
Dimitar Christoff

Reputation: 26165

this does not work because there's a bug: https://mootools.lighthouseapp.com/projects/2706/tickets/1063-no-class-morphing-with-13-no-compat

milestone for fix: 1.3.1 (so very soon) - or you can get the patch to Element.Style.js from the 1.3.1 branch on github.

Upvotes: 3

anna mae
anna mae

Reputation: 106

just my 2 cents. Should not it be like this : http://jsfiddle.net/3wKhN/

Upvotes: 0

mqchen
mqchen

Reputation: 4193

There seems to be an error with Mootools 1.3 Core (non-compat).

If you select the non-compat version in the above Fiddle, you get the following error: Element.Styles.each is not a function.

The solution is probably to switch to MooTools Core 1.3 with compatibility.

(It seems that the property Styles in the Element class no longer exists as of 1.3)

Upvotes: 0

Related Questions