Fratilor sunt incepator in ce priveste AJAX. Incerc sa-l invat si nu sa copii de pe internet. vreau sa fac un meniu pt pagina mea dar m-am blocat la functia onMouseOver, pt ca nu stiu cum sa fac ca meniul drop down(HV menu) sa dipara dupa ce iau mouse-ul.
Codu e acesta:
<html>
<head>
<title>
HV menu
</title>
<style type='text/css'>
div#menuTop1
{
border: 2px solid black;
width: 150px;
}
div#dropDown1
{
visibility: hidden;
width: 150px;
}
.subItem
{
text-align: center;
margin-bottom: 1px;
}
.subItem a
{
background: blue;
text-decoration: none;
display: block;
font-weight: bold;
border: blue;
color: white;
}
.subItem a:active
{
border: gray;
}
.subItem a:hover
{
background:gray;
color: #000000;
width: 150px;
}
div#showInRight
{
position: absolute;
top: 30px;
left: 150px;
width: 150px;
z-index: 20;
visibility: hidden;
}
</style>
<script language='javascript'>
function hideMenus()
{
document.getElementById('dropDown1').style.visibility='hidden';
}
function hideSubMenu()
{
document.getElementById('showInRight').style.visibility='hidden';
}
// the show menu function takes one argument which is the menu to be shown
function showMenu(sm)
{
document.getElementById(sm).style.visibility='visible';
}
</script>
</head>
<body>
<div id='menuTop1' onMouseOver="showMenu('dropDown1');">
Start Here
</div>
<div id='dropDown1'>
<div id='sub1-1' class='subItem' onClick="hideMenus();" onMouseOver="showMenu('showInRight');"><a href='#'>link1</a></div>
<div id='sub1-2' class='subItem' onClick="hideMenus();"><a href='#'>link2</a></div>
<div id='sub1-3' class='subItem' onClick="hideMenus();"><a href='#'>link3</a></div>
<div id='sub1-4' class='subItem' onClick="hideMenus();"><a href='#'>link4</a></div>
<div id='sub1-5' class='subItem' onClick="hideMenus();"><a href='#'>link5</a></div>
</div>
<div id="showInRight" onblur="hideSubMenu();" >
<div id='sub1-1-1' class='subItem' onClick="hideSubMenu();"><a href='#'>link1-1</a></div>
<div id='sub1-1-2' class='subItem' onClick="hideSubMenu();"><a href='#'>link1-2</a></div>
<div id='sub1-1-3' class='subItem' onClick="hideSubMenu();"><a href='#'>link1-3</a></div>
<div id='sub1-1-4' class='subItem' onClick="hideSubMenu();"><a href='#'>link1-4</a></div>
</div>
</body>
</html>
Are cineva vreo idee?


