Заработок с сайта Скрипты
создание сайтов раскрутка сайтов поддержка сайтов
статьи справочик

Статьи -> Интересные скрипты -> Красивое выпадающее меню

Красивое выпадающее меню


<body text=white link="#ff5555" alink="#ff0000"
vlink="#999999">
<style>
.menu{ position: absolute; top:0; z-index: 2;}
.submenu{ position: absolute; top: 22; z-index: 0; visibility: hide; visibility: hidden;}
</style>
<script>
<!--
var old;
var memold;
var subold;
if(document.layers)
{
window.captureEvents(Event.MOUSEDOWN);
window.onmousedown=do_out;
} else
{
document.onmouseup=do_out;
}
function show_layer(x)
{
if(document.layers)
document.layers[x].visibility="show";
else
document.all[x].style.visibility="visible";
}
function hide_layer(x)
{
if(document.layers)
document.layers[x].visibility="hide";
else
document.all[x].style.visibility="hidden";
}
function do_menu(x)
{
if(!old)
old=memold;
if(old!=x)
{
show_layer(x);
old=x;
} else
old="";
}
function do_check(x)
{
if(old && old!=x)
{
hide_layer(old);
show_layer(x);
old=x;
}
do_submenu();
}
function do_out()
{
if(old)
hide_layer(old);
memold=old; old="";
do_submenu();
}
function do_submenu(x)
{
if(subold)
{
hide_layer(subold);
subold="";
}
if(x)
{
show_layer(x);
subold=x;
}
}
// -->
</script>
<div id="m1" class="menu" style="left: 5;">
<table bgcolor="000000" cellspacing="0" cellpadding="2"
border="1" width="115">
<tr>
<td><a href="javascript:do_menu('m1x')"
onmouseover="do_check('m1x')"><b>Системы</b></a>
</td>
</tr>
</table>
</div><div id="m1x" class="submenu" style="left:
5;">
<table bgcolor="000000" cellspacing="0" cellpadding="2"
border="1" width="115">
<tr>
<td><a href="http://">Windows</a><br>
<a href="http://">Mac</a><br>
<a href="http://">Unix</a><br>
<a href="http://">BeOS</a> </td>
</tr>
</table>
</div><div id="m2" class="menu" style="left:
120;">
<table bgcolor="000000" cellspacing="0" cellpadding="2"
border="1" width="100">
<tr>
<td><a href="javascript:do_menu('m2x')"
onmouseover="do_check('m2x')"><b>Software</b></a>
</td>
</tr>
</table>
</div><div id="m2x" class="submenu" style="left:
120;">
<table bgcolor="000000" cellspacing="0" cellpadding="2"
border="1" width="100">
<tr>
<td><a href="http://"
onmouseover="do_submenu('m21x')">Work</a> >><br>
<a href="http://"
onmouseover="do_submenu()">Tools</a><br>
<a href="http://"
onmouseover="do_submenu('m22x')">Spiele</a> >>
</td>
</tr>
</table>
</div><div id="m21x" class="submenu" style="left: 180;
top:24; z-index:1;">
<table bgcolor="000000" cellspacing="0" cellpadding="2"
border="1" width="100">
<tr>
<td><a href="http://">Star Office</a><br>
<a href="http://">Communicator</a><br>
<a href="http://">Photoshop</a>
<a href="http://">Freehand</a> </td>
</tr>
</table>
</div><div id="m22x" class="submenu" style="left: 180;
top:58; z-index:1;">
<table bgcolor="000000" cellspacing="0" cellpadding="2"
border="1" width="100">
<tr>
<td><a href="http://">Tomb Raider</a><br>
<a href="http://">Quake</a><br>
<a href="http://">Swing</a> </td>
</tr>
</table>
</div><div id="m3" class="menu" style="left:
220;">
<table bgcolor="000000" cellspacing="0" cellpadding="2"
border="1" width="100">
<tr>
<td><a href="javascript:do_menu('m3x')"
onmouseover="do_check('m3x')"><b>Hardware</b></a>
</td>
</tr>
</table>
</div><div id="m3x" class="submenu" style="left:
220;">
<table bgcolor="000000" cellspacing="0" cellpadding="2"
border="1" width="100">
<tr>
<td><a href="http://">PC</a><br>
<a href="http://">Mac</a><br>
<a href="http://">Amiga</a><br>
<a href="http://">UNIX</a> </td>
</tr>
Если Вы заметили какие-либо неточности или ошибки в размещенной информации, просим сообщить о них администрации.