| |
|
|
| | Всем привет, я только начинаю осваивать html. Сейчас мне нжно сделать меню с подменю, выпадающее при наведении курсора, но получается только выпадение при клике мышки.
Можете помочь переделать скрипт? Заранее спасибо! :)
<html>
<style>
.menu{ position: absolute; top:0; z-index: 2;}
.submenu{ position: absolute; z-index: 0; visibility: hide; visibility: hidden;}
</style>
<script>
<!--
var old;
var memold;
var subold;
if(document.layers)
{
window.captureEvents(Event.MOUSEOVERN);
window.onmouseover=do_out;
} else
{
document.onmouseup=showmenu(id);
}
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="0080c0" cellspacing="0" cellpadding="0" border bordercolor=3399ff>
<tr>
<td><a href="javascript:do_menu('m1x')" onmouseover="do_check('m1x')">MENU1</a>
</td>
</tr>
</table>
</div><div id="m1x" class="submenu" style="left: 5;">
<table bgcolor="0080c0" cellspacing="0" cellpadding="0" border bordercolor=3399ff>
<tr>
<td><a href="http://index1">index1</a><br>
<a href="http://index2">index2</a><br>
<a href="http:index3//">index3</a><br>
<a href="http://index4">index4</a> </td>
</tr>
</table>
</div><div id="m2" class="menu" style="left: 120;">
<table bgcolor="0080c0" cellspacing="0" cellpadding="0" border bordercolor=3399ff>
<tr>
<td><a href="javascript:do_menu('m2x')" onmouseover="do_check('m2x')">MENU2</a> </td>
</tr>
</table>
</div><div id="m2x" class="submenu" style="left: 120;">
<table bgcolor="0080c0" cellspacing="0" cellpadding="0" border bordercolor=3399ff>
<tr>
<td><a href="http://index5" onmouseover="do_submenu('m21x')">index5</a> >><br>
<a href="http://index6" onmouseover="do_submenu()">index6</a><br>
<a href="http://index7" onmouseover="do_submenu('m22x')">index7</a> >> </td>
</tr>
</table>
</div><div id="m21x" class="submenu" style="left: 170; top: 24; z-index:1;">
<table bgcolor="0080c0" cellspacing="0" cellpadding="0" border bordercolor=3399ff>
<tr>
<td><a href="http://index001">index001</a><br>
<a href="http://index002">index002</a>
</td>
</tr>
</table>
</div><div id="m22x" class="submenu" style="left: 180; top:58; z-index:1;">
<table bgcolor="0080c0" cellspacing="0" cellpadding="0" border bordercolor=3399ff>
<tr>
<td><a href="http://index003">index003</a><br>
<a href="http://index004">index004</a><br>
<a href="http://index005">index005</a> </td>
</tr>
</table>
</div><div id="m3" class="menu" style="left: 220;">
<table bgcolor="0080c0" cellspacing="0" cellpadding="0" border bordercolor=3399ff>
<tr>
<td><a href="javascript:do_menu('m3x')" onmouseover="do_check('m3x')">MENU3</a> </td>
</tr>
</table>
</div><div id="m3x" class="submenu" style="left: 220;">
<table bgcolor="0080c0" cellspacing="0" cellpadding="0" border bordercolor=3399ff>
<tr>
<td><a href="http://index8">index8</a><br>
<a href="http://index9">index9</a><br>
<a href="http://index10">index10</a><br>
</td>
</tr>
</table>
</div>
</body>
</html> | |
| |
|
|
| |
|
|
| |
для: new_master
(10.09.2006 в 20:03)
| | | Это означает - сделать меню заново. Потому что с наведением надо управляться совсем иначе, чем с кликами, с точки зрения юзабельности. Надо объяснять, почему? | |
| |
|
|
