MooTools Tutorials

  • Build a Toggling Announcement Slider Using MooTools 1.2

    A few of my customer have asked for me to create a subtle but dynamic (...I know...) way for them to advertise different specials on their website. Not something that would display on every page, but periodically or only the homepage. Using a trick from GoDaddy's playbook, I put together an announcement slider that toggles on click. Thanks to MooTools 1.2, this was a breeze.

  • Calling For Ideas: dwProgressBar and Typewriter

    Just wanted to throws this out there quick. I'm looking for ideas from you on how to enhance my dwProgressBar and Typewriter classes. I appreciated the compliments but I know there's always room for improvement. I need your ideas!! Here's what I have so far:

  • Create a Dynamic Table of Contents Using MooTools 1.2

    You've probably noticed that I shy away from writing really long articles. Here are a few reasons why:

  • MooTools Typewriter Effect Plugin

    Last week, I read an article in which the author created a typewriter effect using the jQuery JavaScript framework. I was impressed with the idea and execution of the code so I decided to port the effect to MooTools. After about an hour of coding, I had a smooth, customizable Mootools class that accomplished the same goal. Without further adieu, here's my MooTools 1.2 Typewriter plugin.

  • Animated Progress Bars Using MooTools: dwProgressBar

    I love progress bars. It's important that I know roughly what percentage of a task is complete. I've created a highly customizable MooTools progress bar class that animates to the desired percentage.

  • Curing “this.setOptions is not a function” in MooTools 1.2

    On one of the MooTools 1.2 classes I was working on recently, I kept getting the following annoying JavaScript error:

  • Editable Content Using MooTools 1.2, PHP, and MySQL

    Everybody and their aerobics instructor wants to be able to edit their own website these days. And why wouldn't they? I mean, they have a $500 budget, no HTML/CSS experience, and extraordinary expectations. Enough ranting though. Having a website that allows for editable content blocks is the dream of many customers. I've taken a few hours to develop a system for in-page, editable content blocks.

  • Multi-Select Transfers Using MooTools 1.2

    While I was a Zone Leader for DZone's AJAX, CSS, and PHP Zones, DZone's Rick Ross asked me to contact Jeremy Martin with regard to a hot blog post he created: Easy Multi Select Transfer with jQuery. Both Rick and I were impressed with Jeremy's script and asked him to repost on DZone.

  • MooTools 1.2 Tooltips: Customize Your Tips

    I've never met a person that is "ehhhh" about XHTML/javascript tooltips; people seem to love them or hate them. I'm on the love side of things. Tooltips give you a bit more information about something than just the element itself (usually an image or link). Netflix is a perfect example of useful tooltips. When you hover over a movie title, a tooltip displays with a quick summary, cast list, and movie rating. Thanks Netflix — you've saved me yet another page load!

  • This Moo’s For You! MooTools 1.2 Has Arrived!

    U2's been singing this week because Monday was a beautiful day. Monday marked the release of MooTools 1.2, a landmark release. CNET's Aaron Newton (and MooTools developer) was so blown away by Valerio and Co's new ideas that he wanted to name this release 2.0 but Valerio chose to keep this version as 1.2. If you'd like details on the new improvements, please visit the MooTools blog.