How to show the items in menu bar when on mouse over?

Question

Hi,

I have a requirement .In my web page  left side vertical menu I have to show the items when we place the mouse on the particular <li> item.Here the script

<div id="divMenu">

<ul>

 

<li id="CustomList"><a href="#">Custom List ></a>

<ul>

<li><a id="A3" href="~/Location/Index" runat="server">Storage Location</a></li>

<li><a id="A4" href="~/Supplier/Index" runat="server">Supplier</a></li>

<li><a id="A2" href="~/Project/Index" runat="server">Project</a></li>

<li><a id="A6" href="~/Project/Index" runat="server">Project</a></li>

<li><a id="A7" href="~/DrawingType/Index" runat="server">Drawing Type</a></li>

<li><a id="A31" href="~/BufferBoxType/Index" runat="server">Buffer Box Type</a></li>

<li><a id="A10" href="~/EMCModuleType/Index" runat="server">EMC Module Type</a></li>

<li><a id="A32" href="~/SuitcaseTesterType/Index" runat="server">Tester Equipment Type</a></li>

<li><a id="A11" href="~/ProgrammingPod/Index" runat="server">Programming Pod</a></li>

</ul>

</li>

 

I have tried with the below style sheet.Could you please let me know where should I make changes to show when we place mouse over first time.

#divMenu, ul, li, li li {

margin: 0;

padding: 0;

}

#divMenu {

width: 150px;

height: 27px;

}

#divMenu ul

{

line-height: 25px;

cursor:pointer;

}

#divMenu li {

list-style: none;

position: relative;

/* background: #641b1b;*/

background: #100c08;

z-index:auto;

}

#divMenu li li {

list-style: none;

position: relative;

background: #100c08;

left: 148px;

top: -27px;

z-index:auto

}

#divMenu ul li a {

width: 148px;

height: 25px;

display: list-item;

text-decoration: none;

text-align: center;

font-family: Georgia,'Times New Roman',serif;

color:#ffffff;

border:1px solid #eee;

}

#divMenu ul ul {

position: absolute;

visibility: hidden;

top: 27px;

z-index:10;

}

#divMenu ul li:hover ul {

visibility: visible;

cursor:pointer;

}

#divMenu li:hover {

background-color: #945c7d;

cursor:pointer;

display: block;

}

#divMenu ul li:hover ul li a:hover {

background-color: #945c7d;

}

#divMenu a:hover {

font-weight: bold;

}

#divMenu li:hover ul li

{

display: block;

}