MooTools 1.2.4

Written By Aaron Newton, on Monday, October 19th 2009, 5:41pm

It’s been three months to the day since the last point release of MooTools and we’re excited about all the goodness packed into this release. At this point, the 1.2 codebase has a very stable API, and our current plan is to release these point releases every three months or so until the 2.0 codebase is online. If we find any serious bugs, though, we’ll be sure to get fixes into your hands as fast as we can.

Non-breaking Changes

Before we get started telling you all the yummy stuff we’ve got for you, let us first assure you that the code we released today is 100% backwards compatible with the previous versions. Upgrading should be as simple as dropping the new files in place.

MooTools Core - 1.2.4

This version of the MooTools Core is one of the most tested and refined we’ve ever released. We’ve fixed numerous small bugs, but the ones you may notice most of all are:

  • Added Trident 6 (IE8) detection
  • Request can take an instance of URI as a url
  • JSON.stringify and JSON.parse native methods are now accessible
  • DomReady always fires before load event
  • Fix for creating a Request in early versions of IE6
  • Fixes and optimizations for Element.getOffsets

This short list doesn’t do it justice, there have been roughly 70 commits to the core since 1.2.3, but most of these fixes are minor including adding to documentation, adding more tests, etc. The point here is that the 1.2 branch is increasingly stable, which is why we release it so infrequently.

Gecko (Firefox) Detection in 1.2.4, 1.1.2

MooTools has always used object sniffing to detect rendering engines, and while not perfect, this method has proved very reliable in recent years. However, the upcoming Firefox 3.6 marks a shift in our thinking on this subject because Gecko detection will no longer work on it without an update. We recognize the significance of this, and therefore are releasing updates for both 1.2 and 1.1 because we understand that 1.1 is still in widespread use.

Looking towards 2.0, we have overhauled our browser detection to be based on the user agent string. We realize that this is not without its forward compatibility risks, however it is the standard practice among JavaScript libraries because of potential issues as Firefox 3.6 demonstrates. As browsers grow closer together, looking at “features” to separate them will become more difficult and risky. User agent strings, on the other hand, have remained very consistent in recent years with the exceptions being in mobile browsers and with Google Chrome coming on stage. With 2.0, browser detection will only be used where it would be impossible not to, in order to give the consistent experience across browsers that one would expect from a world-class JavaScript framework.

For those of you still running 1.1, it is imperative that you update to 1.1.2. When we get 1.1.2 up on Google’s JavaScript CDN service, those of you requesting 1.0 or 1.1 from that service should see the upgrade without doing anything. If you do not update your 1.1 scripts, users visiting in Firefox 3.6 and beyond will likely encounter issues.

MooTools More -

While MooTools Core has remained pretty much the same since the original 1.2 release, MooTools More continues to add new features that should make building sites even easier. This release is jam-packed with bug fixes and new plugins, and we’re excited to see what the community will do with them. Here’s a quick list:

  • over 30 issues fixed or closed (in lighthouse)
  • New feature: Element.Delegation - a partial port of event delegation from MooTools 2.0 (does not support custom events or blur/focus)
  • New feature: Elements.From converts html strings to DOM elements
  • New feature: Depender - a client side MooTools dependency loader ** Related: Depender App - a server side implementation (that’s much faster) - more on this in a later post
  • New feature: Mask - masks elements (including the window) with a semi-opaque overlay
  • New feature: Spinner - automates the creation of ajax spinners over DOM elements being updated (previously known as Waiter on
  • New feature: Form.Request, Form.Request.Append - automates creating ajax forms that update HTML in DOM elements (previously Fupdate on
  • New feature: HtmlTable, HtmlTable.Zebra, HtmlTable.Sort, HtmlTable.Select - interactive and auto-generated html table elements
  • New feature: Keyboard - a robust event manager for keyboard groupings
  • Added new option to Fx.Accordion: returnHeightToAuto
  • FormValidator is now Form.Validator ** Added credit card number validator to FormValidator
  • MooTools Lang is now a part of MooTools More (again)
  • Added timeDiff method to Date.Extras
  • Added ability to ignore scroll position with Element.Position
  • Element.setPosition is now Element.position (non-breaking change)
  • Added hideAll and showAll methods for OverText
  • Added Element.isVisible method
  • URI’s get method no longer returns null for missing parts; it returns an empty string.
  • Various other tweaks and bug fixes

Get Coding!

This release has a lot of good stuff in it, but it’s worth noting we have a LOT of other things in the oven right now.

The MooTools development team continues to grow and the more people involved with the creation of the framework, the more cool things we can release. If you want to get involved with making MooTools, all you have to do… is start writing code. Get involved on github, in the mailing list, and start getting your own plugins ready for the upcoming release of the MooTools Forge.

48 Responses to “MooTools 1.2.4”

  1. Barryvan says:

    This is fantastic — I’m particularly looking forward to getting going on the new Depender system. Thanks to all the Moo devs!

  2. Ryan Rampersad says:

    This release looks incredible with all of those Mootools More goodies. Great work Mootools team!

  3. jay says:


  4. Mrityunjay Kumar says:

    Excited about using the latest release.. Cheers

  5. David Candreva says:

    Some great new features!

  6. Bezerik says:

    ohh yeaa! great work team developer!

  7. Anton Suprun says:

    Great work, guys!

  8. Marc Fowler says:

    Really, really fantastic guys. Can’t wait to get that up on Google’s CDN and start using the hell out of it. It sounds amazing.

  9. Rolf says:

    Sweeet. I could use some extra hours each day for exploration and testing though, this is too much :)

  10. mookatt says:

    Great new features. Thanks again!

  11. false says:

    thanks a lot !

  12. Elko says:

    Nice! Thx to the Dev-Team and all Supporters.

  13. shefla says:

    Good to see that mootools is going forward.

  14. Andrea says:

    The 1.2.4 is 99% backwards compatible with the previous versions :D

    the fx.slide hide function now gets the overflow from the element you are sliding, in the 1.2.3 the overflow was set hidden by default

    anyway thanks very much for the update :)

  15. JamesH says:

    Nicely done - although I doubt I’ll use it, I dig the addition of the Elements.From method. Very cool.

  16. Robbert Broersma says:

    Trident 6? Trident 4 you mean?

  17. Savageman says:

    Yeah, great upcoming plan! I was waiting for the documentation off all the new stuff in Mootools More: now it’s done. The only missing thing would now be examples for all the classes inside the documentation.

  18. Mantas says:

    Just downloaded:


    Dont seem polished enough yet

  19. Barry Jones says:

    Fantastic news, I’ve been waiting for Mootools 1.2.4 for a while. Well done everyone who has worked on this!

  20. GB says:

    Where do we download Mootool 1.1.2? Can’t find it anywhere? Do we need to wait for it to be hosted on Google’s CDN?

  21. Daniel B says:

    Since updating to 1.2.4 more my image that I have the Tip on fades away with the hiding of the tooltip. with a class .helpTips. Any ideas what changed and what the fix is?

    window.addEvent(‘domready’, function(){ //store titles and text $$(‘.helpTips’).each(function(element,index) { var content = element.get(‘title’).split(‘::’);‘tip:title’, content[0]);‘tip:text’, content[1]); });

    //create the tooltips
    var tipz = new Tips('.helpTips',{
        className: 'helpTips',
        fixed: true,
        hideDelay: 50,
        showDelay: 50

    tipz.addEvents({ 'show': function(tip) {tip.fade('in');}, 'hide': function(tip) {tip.fade('out');} });


  22. Daniel B says:

    Also after my image fades away I get this error:

    Error: b.getParent is not a function Source File: mootools-more.js Line: 635

  23. Barryvan says:

    I just discovered an interesting new behaviour in More’s Fx.Slide: the change in initialize() from

    styles: $extend(this.element.getStyles(‘margin’, ‘position’), {overflow: ‘hidden’})


    styles: this.element.getStyles(‘margin’, ‘position’, ‘overflow’)

    means that you now have to manually ensure that the elements you want to slide have ‘overflow: hidden’ set on them, or the behaviour will differ from 1.2.3. Not a huge problem, but one that people should probably be made aware of when they’re upgrading.

  24. Rafael F P Viana says:

    Nice update!! Mootools is great.

  25. Anton Shevchuk says:

    Please check my previous comment - it consist small fix for MooTools library (maybe your blog mark it as spam)…

  26. Anton Shevchuk says:

    I resend it (changes for allow whitespaces - it’s for W3C standart of CSS selector :nth-child):

    parseNthArgument: function(argument){
        if (Selectors.Cache.nth[argument]) return Selectors.Cache.nth[argument];
        // whitespace in Nth arguments is valid
        var parsed = argument.match(/^[ ]?([+-]?\d)?([a-z]+)?([ ]?[+-]?[ ]?\d)?[ ]?$/);
        if (!parsed) return false;
        var inta = parseInt(parsed[1], 10);
        var a = (inta || inta === 0) ? inta : 1;
        var special = parsed[2] || false;
        // remove whitespaces
        var b = parseInt(parsed[3].replace(/\s+/g, ''), 10) || 0;

    if (a != 0){
        while (b < 1) b += a;
        while (b >= a) b -= a;
    } else {
        a = b;
        special = 'index';
    switch (special){
        case 'n': parsed = {a: a, b: b, special: 'n'}; break;
        case 'odd': parsed = {a: 2, b: 0, special: 'n'}; break;
        case 'even': parsed = {a: 2, b: 1, special: 'n'}; break;
        case 'first': parsed = {a: 0, special: 'index'}; break;
        case 'last': parsed = {special: 'last-child'}; break;
        case 'only': parsed = {special: 'only-child'}; break;
        default: parsed = {a: (a - 1), special: 'index'};
    return Selectors.Cache.nth[argument] = parsed;


  27. Anton Shevchuk says:

    And I found two bugs with selector :nth-child - selector :nth-child(-n+4) - choose all children, should be choose all after four - selector :nth-child(4) - working, selector :not(:first-child) - working, selector :not(:nth-child(4)) - don’t work :(

  28. deef says:

    Thank you guys! Is this release being included in google ajax libraries?

  29. Aaron Newton says:

    @Barry I’ll re-visit that code and reconsider the change; I need to see if we made it because of some other bug. Good catch.

    @deef, yes, but the google libraries are always a little behind our releases (it’s a manual process). Also, we’ll be releasing a bug fix release probably tomorrow ( that addresses a few minor glitches in the current release. You can see what will be in it on lighthouse

  30. gonchuki says:

    as much as I love mootools, it’s sad that bug #651 is still open since April given that it was a regression when moving from 1.2.0 to 1.2.1 and it got worse on the 1.2.2 class revamp (which in turn is part of 2.0, so the future shiny release will be buggy on day zero). Either your test suite is missing some important tests, or you are missing the importance of this matter. I would really like to help on this (and see it fixed on 1.2.5 and when 2.0 launches), but don’t really know what else to do.

  31. nimmr says:

    Uuh this looks great. I’m especially looking forward to playing around with Depender.

  32. Arjan says:

    Thank you MooTools guys! And thank you Barryvan for the Fx.Slide comment, I was already searching why my template was suddenly malfunctioning with the new MooTools release.

  33. SamGoody says:

    Great Job. Really. Especially the dependency builder.

    Keep up the great work! ( Now, just a forge, and perhaps an offhand comment by Valerio that he actually values his community, and the world would be absolutely rosy!)

  34. ltdeta says:

    great job!!

  35. Bob says:

    @Barryvan Thnx! I switched it back. Why was it changed?

  36. Johannes says:


    maybe i am blind, but where can i download version 1.1.2?

  37. Luis Merino (rendez) says:

    Congrats for the hard work team! Of course, I’m already using all the goodies on a kick-ass new project.

  38. Ollie Maitland says:

    It is pleasing to see all the “New Features” going into More rather than Core which I think cleanly separates Core (which I see as the JS framework for data models and controller stack) from More (the UI framework side of things). More is certainly made more manageable by the addition of the Dependency component. Thank you guys!

    Does “Added ability to ignore scroll position with Element.Position” have any implication on to #510 on More? This is a bug that I often come up against and although there is a patch it would be nice to have it patch in MooTools 1.2.4

    Looking forward to 2.0

  39. Aaron Newton says:

    I can’t say for sure if #510 is fixed, but it probably is. The issue was not in Element.Position though; Drag.Move doesn’t use it. I’ll try and look into the issue. If you can post a to the bug demonstrating the problem, it would be really helpful.

  40. Alograg says:

    Where can I send a proposal to replace Swiff class?

  41. aaron says:

    @Alograg, you can always fork on github and send a pull request to me (anutron) or others on the dev team. Alternately, you can post to lighthouse.

  42. biebabeluba says:

    can’t wait for the new MooTools!

  43. Draghmar says:

    I’ve noticed some odd behavior on Tips class after updating to 1.2.4 - i’m using it with addition of onShow and onHide to add fade effect instead of simple show/hide. Right now element that has cursor on it (this element should trigger tip itself), dissapears after moving cursor out. Tip doesn’t show at all. When I remove onShow and onHide everything is working fine.

  44. Dominik says:

    “DomReady always fires before load event” -> are you sure that this is fixed? i am using 1.2.4 and i still get the load event before domready (in ie7/8)

  45. Kaelzhang says:

    With every version of mootools, window.document.body.getWindow() will go wrong in IE6-8

  46. aaron says:

    1.1.2 is available on github ( We’ll be adding more links to it around the site shortly.

  47. aaron says:

    @Arjan, @Barryvan, The Fx.Slide overflow issue is resolved in

  48. Avinash says:

    Hi All, have you any question for this? In opera. if element style is display:none then $(‘demo-ele’).getSize(); is not working properly. It is giving 0px height and 0px width. But If I make the display:block and visibility:hidden, it works same as other browser. Is this knows bug for mootools or any any solution available for this or not?

    Thanks Avi