Ingredients:

sprites, unorderdered lists, Mootools knowledge.

Cooking time:

1 hr

Result:

Can be seen on our website – Rborn Web development – mouse-over the top menu.

Upload forms are something we often use in our projects. Sometimes a simple upload form is not enough, so I’ll try to compile a list with enhanced file upload forms that help us to improve the look, functionality and usability of our sites.

The last MooTools version offers a validation plugin in the mootools-more package, that will help us solve our task. Basically we need to add some classes to out inputs, to reflect the type of validation we want. For our form, we need only name – mandatory, and email – mandatory + correct email formatting.

Tweet I am so used with MooTools as I started to forgot the basic Javascript and more, I started to dislike a lot to write code in pure js. But MooTools lacks the touch events ipod and iphone has. So I wrote a small code that adds the touchevents –  well, touch, gesture, animation and [...]

Tweet I know, I know, browser sniffing is a bad habit and it should not be used, but still, there are cases when you will want to display a message to the user (ordinary users, that don’t hack their’s browser navigator.userAgent) or you really need to know what browser is he using. For example Chrome. [...]

Tweet As the guys from Mozilla say “The JavaScript shell provides a simple way to run scripts in batch mode or an interactive environment for exploratory programming.” So basically you can create some tests for you app based on javascript without needing a browser, but using rhino. With Mootools is a little complicated, as it [...]

Mootools ‘ajax’ request for local files or how to make ajax requests to a local file without the need of a web server.

Mootools 1.2 tutorials, covering much of the basics of the library, the bundled plugins and downloadable examples.

Tweet There are moments when we need to show a zoomed image of a product (or something else) that requires to be as much as user friendly as possible. An example is e-commerce sites that use high quality images for high impact over the client’s mind (jewelery for example). In this case zooming a particular [...]

The today’s tutorial will try to explain how to make an element draggable or resizable – or even both in the same time, using the MooTools framework.
To accomplish this we’ll make use of two functions existent in MooTools: makeDraggable() and makeResizable().