Submit Your Article
Home Articles News Tutorials Videos Add An Article
Topics: Design Photoshop Programming PHP CSS Java Database Web Development Javascript Ajax
– Close + Open

Find Out More About DevWebPro!

Sign up for the newsletter


» Terms & Conditions

Welcome to the New DevWebPro!

DevWebPro Includes:
  Hundreds Of Tutorials   Developer News
  Unique Gadget Videos   Tons of Topics to Discuss
  Expert Advice   We Will Publish Your Articles

8 Tutorials On Creating Mootools Navigation Menu, Dropdown And Sliding Menu

Tuesday, December 15th, 2009
Text: Decrease Font Size Increase Font Size | Print Print Article | Share: Delicious Digg StumbleUpon Post to Twitter Post to Facebook

“ MooTools is a compact, modular, Object-Oriented JavaScript framework designed for the intermediate to advanced JavaScript developer. It allows you to write powerful, flexible, and cross-browser code with its elegant, well documented, and coherent API

In this post I’ve selected 8  Mootools navigation,dropdown and sliding menu tutorials. These tutorials will help you create better web 2.0 effects.

1- Nice animated menu using CSS and Mootools

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

Mootoos_menu_1

2- Creating a Sliding Menu Using the MooTools Framework

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.

Mootoos-sliding-menu_1

3- Two CSS vertical menu with show/hide effects

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

Mootoos-effect-_1

4- 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.

Mootools-dropdown-menu_1

5- Sliding top panel using mootools

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

slide panel mootools

6- Show-Hide login panel

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

show-hide-login-panel-Mootools

7- MenuMatic

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.

menu-magic-mootools

8- Drop down menu using Mootools 1.2

dropdown-mootools-menu

Topics: , , , , , ,

Leave a Comment

DevWebPro is an iEntry Network ® publication - © 1998-2010 All Rights Reserved