MooTools

Create A MooTools Slider With Spanning Element

The MooTools slider is a good little application, and creates a reliable means of adding in a slider tool to a site. However, one thing that the MooTool slider is missing is a block that covers what is on the left hand side of the slider, before the handle.

Before we go into to how to create the tool, I have created an example of the slider. The colours are deliberately garish in order to show the different elements of the slider.

Create a page with the following HTML.

MooTools Home Page

If you are looking for information about the MooTools JavaScript framework then your first stop should be the MooTools home page. The site not only allows you to download MooTools, but it is also a great resource for learning how to use MooTools.

Highlight Area With mootools

Creating a simple highlight effect is quite easy when you use the JavaScript framework mootools.

The first thing to do is grab the mootools library from the site and link it in your web page. You can select different components with mootools, but if you grab the whole thing you can start to play with whatever you want. Put this line of code in the head section of your web page.

Subscribe to MooTools