DHTML Menu...
code is as below:
------------------------------
<table class="mainmenu" id="mainmenu" cellpadding="0" cellspacing="0" border=0 width="450">
<tr>
<td class='menutitle'>|</td>
<td class='menutitle' onmouseover="changecolorOn(this);showmenu('Guideli nes','7','163')" onmouseout="changecolorOut(this);hidemenu('Guideli nes')" align="center" >Guidelines
<table class="menu" id="Guidelines" width="112" border="0" align="left">
<tr><td onclick="ShowPg('Guidelines.html')" onmouseover="changecolorOnS(this)" onmouseout="changecolorOutS(this)">View Guidelines</td></tr>
<tr><td onclick="ShowPg('ratings.html')" onmouseover="changecolorOnS(this)" onmouseout="changecolorOutS(this)">Rating</td></tr>
</table>
</td>
<td></td>
<td class='menutitle' onmouseover="changecolorOn(this);showmenu('Apprais al','93','163')" onmouseout="changecolorOut(this);hidemenu('Apprais al')" align="center" >Self-Appraisal
<table class="menu" id="Appraisal" width="112" border="0" align="left">
<tr><td onclick="ShowPg('Sec1.asp?mode=view')" onmouseover="changecolorOnS(this)" onmouseout="changecolorOutS(this)">Form</td></tr>
<tr><td onclick="ShowPg('Behavior.asp?mode=view')" onmouseover="changecolorOnS(this)" onmouseout="changecolorOutS(this)">Behavior Rating</td></tr>
</table>
</td>
---------------------------
But the issues is that if changed resolution the submenu appears at different location ( a bit away from where it should be...)
what i m trying is to show submenu on the basis of the current menu item i.e. <TD> tag..will pas td element to javascript function and that function will detect height - width - left - right of <td> element and show submenu acoordingly...the current javascript is like....
-------------------
function showmenu(elmnt,lt,tp)
{
document.getElementById(elmnt).style.visibility="v isible"
document.getElementById(elmnt).style.left=lt;
document.getElementById(elmnt).style.top=tp;
}
----------------------
which should be like...
-------------------
function showmenu(elmnt,eleTD)
{
document.getElementById(elmnt).style.visibility="v isible"
document.getElementById(elmnt).style.left=eleTD.le ft;
document.getElementById(elmnt).style.top=eleTD.top + eleTD.height;
}
----------------------
but can't figureout this......
Any blast in mind?????
Thanks...
Rupen Anjaria.:)
------------------
We CAN'T avoid problems, but can solve it.
|