<!DOCTYPE html PUBLIC
"-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<body>
<!--
===== DHTML MENU START =========================================================
Copyright (C) 2005 Ilya S. Lyubinskiy. All rights reserved.
Technical support:
http://www.php-development.ru/
YOU MAY NOT
(1) Remove or modify this copyright notice.
(2) Distribute this code, any part or any modified version of it.
Instead, you can link to the homepage of this code:
http://www.php-development.ru/javascripts/menu.php.
YOU MAY
(1) Use this code on your website.
(2) Use this code as a part of another product provided that
its main use is not creating javascript menus.
NO WARRANTY
This code is provided "as is" without warranty of any kind, either
expressed or implied, including, but not limited to, the implied warranties
of merchantability and fitness for a particular purpose. You expressly
acknowledge and agree that use of this code is at your own risk.
-->
<script type="text/javascript">
var at_timeout = 50;
function at_show_aux(parent, child)
{
var p = document.getElementById(parent);
var c = document.getElementById(child);
p.className = "active";
var top = (c["at_position"] == "y") ? p.offsetHeight+2 : 0;
var left = (c["at_position"] == "x") ? p.offsetWidth +2 : 0;
for (; p; p = p.offsetParent)
{
if (p.style.position != 'absolute')
{
left += p.offsetLeft;
top += p.offsetTop;
}
}
c.style.position = "absolute";
c.style.top = top +'px';
c.style.left = left+'px';
c.style.visibility = "visible";
}
function at_hide_aux(parent, child)
{
document.getElementById(parent).className = "parent";
document.getElementById(child ).style.visibility = "hidden";
}
function at_show()
{
var p = document.getElementById(this["at_parent"]);
var c = document.getElementById(this["at_child" ]);
at_show_aux(p.id, c.id);
clearTimeout(c["at_timeout"]);
}
function at_hide()
{
var c = document.getElementById(this["at_child"]);
c["at_timeout"] = setTimeout("at_hide_aux('"+this["at_parent"]+"', '"+this["at_child" ]+"')", at_timeout);
}
function at_attach(parent, child, position)
{
p = document.getElementById(parent);
c = document.getElementById(child );
p["at_child"] = c.id;
c["at_child"] = c.id;
p["at_parent"] = p.id;
c["at_parent"] = p.id;
c["at_position"] = position;
p.onmouseover = at_show;
p.onmouseout = at_hide;
c.onmouseover = at_show;
c.onmouseout = at_hide;
}
function dhtmlmenu_build_aux(parent, child, position)
{
document.getElementById(parent).className = "parent";
document.write('<div class="vert_menu" id="'+parent+'_child">');
var n = 0;
for (var i in child)
{
if (i == '-')
{
document.getElementById(parent).href = child[i];
continue;
}
if (typeof child[i] == "object")
{
document.write('<a class="parent" id="'+parent+'_'+n+'">'+i+'</a>');
dhtmlmenu_build_aux(parent+'_'+n, child[i], "x");
}
else document.write('<a id="'+parent+'_'+n+'" href="'+child[i]+'">'+i+'</a>');
n++;
}
document.write('</div>');
at_attach(parent, parent+"_child", position);
}
function dhtmlmenu_build(menu)
{
for (var i in menu) dhtmlmenu_build_aux(i, menu[i], "y");
}
</script>
<style type="text/css">
div.dhtml_menu div.vert_menu
{
position: absolute;
visibility: hidden;
}
div.dhtml_menu div.horz_menu a { display: block; float: left; }
div.dhtml_menu div.vert_menu a { display: block; float: none; }
div.dhtml_menu div.vert_menu
{
border-bottom: 1px solid #000000;
}
div.dhtml_menu div.horz_menu a,
div.dhtml_menu div.vert_menu a
{
width: 140px;
height: 25px;
line-height: 24px;
vertical-align: middle;
border: 1px solid #000000;
text-decoration: none;
font-family: verdana;
font-weight: 900;
font-size: 15px;
color: #ffa500;
background: url('')
0px
0px;
background-color: #153e52;
}
div.dhtml_menu div.horz_menu a
{
margin-right: -1px;
}
div.dhtml_menu div.vert_menu a
{
margin-bottom: -1px;
}
div.dhtml_menu div.horz_menu a:hover,
div.dhtml_menu div.vert_menu a:hover
{
color: #ff0000;
background: url('')
0px
0px;
background-color: #27408b;
}
div.dhtml_menu div.horz_menu a.parent,
div.dhtml_menu div.vert_menu a.parent
{
color: #ffa500;
background: url('')
0px
0px;
background-color: #153e52;
}
div.dhtml_menu div.horz_menu a.active,
div.dhtml_menu div.vert_menu a.active,
div.dhtml_menu div.horz_menu a.active:hover,
div.dhtml_menu div.vert_menu a.active:hover
{
color: #ff0000;
background: url('')
0px
0px;
background-color: #27408b;
}
div.horz_menu{position: absolute;left: 200px; top: 200px;}
</style>
<div class="dhtml_menu">
<div class="horz_menu">
<a id="dhtml_menu_1" href="Array"> dfkdlf</a>
<a id="dhtml_menu_2" href="Array"> Main 2 </a>
<a id="dhtml_menu_3" href="Array"> Main 3</a>
<a id="dhtml_menu_4" href="Array"> Main4</a>
<br clear="both" />
</div>
<script type="text/javascript">
dhtmlmenu_build({"dhtml_menu_1" : {"-" : "javascript:alert(\'Main 1\');", " Level 1-1" : "javascript:alert(\'Level 1-1\');", " Level 1-2 >>" : {"-" : "javascript:alert(\'Level 1-2\');", " Level 2-1" : "javascript:alert(\'Level 2-1\');", " Level 2-2" : "javascript:alert(\'Level 2-2\');", " Level 2-3" : "javascript:alert(\'Level 2-3\');"}, " Level 1-3" : "javascript:alert(\'Level 1-3\');"}, "dhtml_menu_2" : {"-" : "javascript:alert(\'Main 2\');", " Level 1-1" : "javascript:alert(\'Level 1-1\');", " Level 1-2 >>" : {"-" : "javascript:alert(\'Level 1-2\');", " Level 2-1" : "javascript:alert(\'Level 2-1\');", " Level 2-2" : "javascript:alert(\'Level 2-2\');", " Level 2-3" : "javascript:alert(\'Level 2-3\');"}, " Level 1-3" : "javascript:alert(\'Level 1-3\');"}, "dhtml_menu_3" : {"-" : "javascript:alert(\'Main 3\');", " Level 1-1" : "javascript:alert(\'Level 1-1\');", " Level 1-2 >>" : {"-" : "javascript:alert(\'Level 1-2\');", " Level 2-1" : "javascript:alert(\'Level 2-1\');", " Level 2-2" : "javascript:alert(\'Level 2-2\');", " Level 2-3" : "javascript:alert(\'Level 2-3\');"}, " Level 1-3" : "javascript:alert(\'Level 1-3\');"}, "dhtml_menu_4" : {" Level 1-1" : "javascript:", " Level 1-2 >>" : {"-" : "javascript:", " Level 2-1" : "javascript:", " Level 2-2" : "javascript:", " Level 2-3" : "javascript:"}, " Level 1-3" : "javascript:"}});
</script>
</div>
<!--
===== DHTML MENU END ===========================================================
-->
</body>
</html>