| <style type="text/css">
.menu {
background-color: #40a0c0;
border-color: #80e0ff #006080 #006080 #80e0ff;
border-style: solid;
border-width: 2px;
position: absolute;
left: 0px;
top: 0px;
visibility: hidden;
}
a.menuItem {
border: 0px solid #000000;
color: #ffffff;
cursor: default;
display: block;
font-family: MS Sans Serif, Arial, Tahoma,sans-serif;
font-size: 8pt;
font-weight: bold;
padding: 2px 12px 2px 8px;
text-decoration: none;
}
a.menuItem:hover {
background-color: #004060;
color: #ffff00;
}
</style>
<link rel="stylesheet" href="../liora3.css">
</head>
<body >
<div id="myMenu" class="menu">
<a class="menuItem" href="../Tab.htm" target=new>Menu
Item 1</a>
<a class="menuItem" href="../Tab.htm">Menu Item
2</a>
<a class="menuItem" href="../Tab.htm">Menu Item
3</a>
<a class="menuItem" href="../blank.html">Menu
Item 4</a>
<a class="menuItem" href="../blank.html">Menu
Item 5</a>
</div>
<a href="" onclick="openMenu(event, 'myMenu');return
false;">Open Menu</a>
<script type="text/javascript">
document.getElementById("myMenu").onmouseout
= closeMenu;
function openMenu(event, id) {
var el, x, y;
el = document.getElementById(id);
if (window.event) {
x = window.event.clientX + document.documentElement.scrollLeft
+ document.body.scrollLeft;
y = window.event.clientY + document.documentElement.scrollTop +
+ document.body.scrollTop;
}
else {
x = event.clientX + window.scrollX;
y = event.clientY + window.scrollY;
}
x -= 2; y -= 2;
el.style.left = x + "px";
el.style.top = y + "px";
el.style.visibility = "visible";
}
function closeMenu(event) {
var current, related;
if (window.event) {
current = this;
related = window.event.toElement;
}
else {
current = event.currentTarget;
related = event.relatedTarget;
}
if (current != related && !contains(current,
related))
current.style.visibility = "hidden";
}
function contains(a, b) {
// Return true if node a contains node b.
while (b.parentNode)
if ((b = b.parentNode) == a)
return true;
return false;
}
</script>
|