CSS Dropdown Menu


Here i want to make a simple Drop down menu using CSS and Java Scripts.Several website need menu but Static menu link is not good enough.

For This concept i try to make some this.Drop Down Tabs is very simple, as the entire menu consist of regular HTML and styled using CSS.

Logically it makes sense to think of the menu in the following three parts :

1) HTML for the menu tabs

<div id=”bluemenu” class=”bluetabs”>
<ul>
<li><a href=”#”>Home</a></li>
<li><a href=”#” rel=”dropmenu1″>CSS</a></li>
<li><a href=”#” rel=”dropmenu2″>Partners</a></li>
<li><a href=”#”>Tools</a></li>
</ul>
</div>

2) HTML for drop down menu(s)

<!–1st drop down menu –>

<div id=”dropmenu1″ class=”dropmenudiv”>

<a href=”#”>CSS Drive</a>

<a href=”#”>JavaScript Kit</a>

<a href=”#”>Coding Forums</a>

<a href=”#”>JavaScript Reference</a>

</div>

3) Script to call following the HTML for both of the above to initialize a Tab Menu instance

<script>
//SYNTAX: tabdropdown.init(“menu_id”, [integer OR “auto”])
tabdropdown.init(“bluemenu“, 0)
</script>

The Project images…………..

menuemenue2

4 thoughts on “CSS Dropdown Menu

Leave a reply to ishan banga Cancel reply