8 MooTools tips, tutorials, techniques & resources
Two CSS vertical menu with show/hide effects
"I wrote this simple tutorial with two vertical menu examples with show/hide menu effect. First example uses a simple JavaScript code. Second example uses mootools to show/hide the menu with a nice vertical slide-in/slide-out effect."
MooTools 1.2 OpenLinks Class
"One of the tips I tell my customer is "whenever you create links to PDFs, Excel XLS', Word DOCs, or JPG/GIF/PNG images, make the link open in a new window." Unfortunately, my customers don't always follow this guideline. In an effort to correct their mistakes, I've created a MooTools class that analyzes links on the page and adds a target attribute when necessary."
Build a Slick and Simple MooTools Accordion
"In speaking with designers, I frequently hear how much they'd like to use an accordion on their site but they think it's either too time-consuming or that they don't have the ability to code javascript. Not true! To prove my point, I'll use a little MooTools magic and some easy XHTML / CSS to accomplish a slick accordion effect."
Nice Ajax effect for message box using Mootools
"A friend asked to me how to implement a message box which appears when an user submits a form and disappears when a generic Ajax request is completed. A simple way to implement a chain of effects like this is using mootools and this tutorial explains how to implement it with some lines of JavaScript code."
Create a Digg-like FAQ Page Using mootools
"In this tutorial, We’re going to create a simple FAQ page similar to Digg using the mootools framework. Digg’s Frequently Asked Questions page is long, with over 60 questions. To make the page more scannable, they’ve hidden the corresponding questions only when the answer is clicked."
Using CSS and Mootools to simulate Flash horizontal navigation effect
"In particular using Flash I loved this kind of layout/effect: follow mouse sliding content. Yesterday I asked myself how could obtain the same effect using CSS and HTML... This tutorial explains how to use Mootools and pure CSS / HTML code to simulate a Flash (follow mouse) horizontal navigation effect."
Mootools Image Crop: MooCrop
"MooCrop is an image cropping utility using the powerful mootools javascript framework. Alone, it is only a selection tool but when used with a serverside script then it becomes an image manipulation tool."
List of Ajax form Validators
"Inputing correct data into any web application or website is very important. There is two different ways to validate forms by either Server-side or Client-side. The list below is Client-Side Ajax Form Validator."