Creating Accordion, Dropdown and Sliding Menus in Mootools

Jitu — Mon, 07 Dec 2009 14:05:26 +0000

MenuMatic, Creating Horizontal and Vertical Menus in Mootools

MenuMatic is a MooTools 1.2 class that takes a sematic ordered or unordered list of links and turns it into a dynamic drop down menu system.

Horizontal Sample

Vertical Sample

View Source Article

Show-Hide login panel in you wordpress theme using Mootools

Add a show/hide login panel to your Wordpress theme using Mootools.

View Source Article

Creating Accordion type, Animated menu in Mootools

This tutorial illustrates how to implement a nice accordion (animated) menu using Mootools and some lines of CSS and HTML code ready to reuse in your project.

View Sample

View Source Article

Creating a Sliding Menu Using the MooTools Framework

The tutorial here will show you how to create a sliding menu using the MooTools framework, you are required to have basic knowledge of HTML, you don’t need to know JavaScript to follow this tutorial, but JavaScript will help you understand what the code actually does.

View Sample

View Source Article

Mootools Show and Hide effect Menu

This is the basic example with a simple show/hide effect which you can implement just with some lines of JavaScript code.

View Sample

View Source Article

Creating Drop-Down Navigation with Movable Type

The goal of this tutorial is to demonstrate how to add category driven drop-down menus to your web site.

View Source Article

Sliding top panel Menu using mootools

This tutorial explains how to realize a simple sliding top panel (top/down) Menu using mootools, some line of css code and JavaScript.

View Source Article

JavaScript drop down menu using Mootools 1.2

A very easy, unobtrusive way to create a drop down menu

View Sample

View Source Article

BySlideMenu – Nice and powerful accordion menu

What is BySlideMenu?
BySlideMenu is a plugin for Mootools which allow you to easily create a beautiful accordion menu (sliding menu) on any element you want (ul/li, div, p …) using images and/or text.

Features

Works horizontally or vertically.
Automatic size – The container width/height can be adjusted automatically.
Menu is expandable by mouseover or by click, as you want.
Menu can be pinned or not, by mouseover or click, you choose.
A default index can be defined.
Can be used with any elements (ul/li, div, p…)
Overflow support.

View Soure Article

Flash Without Flash: Elegant Menu Fly-out

It’s a more elegant solution than regular fly-outs, but unfortunately, it’s done in Flash. Here is my version in JavaScript built with Mootools. Follow along as I describe the HTML, CSS, and JavaScript.
View Example
View Source Article

Amazing Mootools Plugins to enhance your website

Jitu — Thu, 26 Nov 2009 07:27:06 +0000

For vastly improving the User Interface of your website you just need to use a snippet of code and there is none better than MooTools javascript framework. Have a look into the following plugins and you may like it.

FancyForm

FancyForm is a powerful checkbox replacement script used to provide the ultimate flexibility in changing the appearance and function of HTML form elements. It’s accessible, easy to use and degrades gracefully on all older, non-supporting browsers.

Demo And Download

Milkbox

Milkbox is an amazing lightbox script which is easy to implement and can be used for photo galleries, videos, etc…

Demo And Download

Quickboxes

Quickboxes allows you to check multiple checkboxes in one mouse click and drag

Demo And Download

SmoothScroll

SmoothScroll allows the page to animate down to an anchor within the page instead of the ugly jump that occurs by default.

Demo
Documentation
Download

Tips

This allows you to control how tooltips display so make them creative.