Здравствуйте, У меня есть задача сделать выпадающее меню с использованием яваскрипта, но есть одна загвоздка - я им не владею вобще, поэтому я взял готовое меню (простенькое) и сляпал под себя, но оно не работает в IE. Объясню суть: у меня монитор 17" и когда я навожу мышью на таблицу, которая появляется при наведении на кнопку, то она уезжает, ну вобщем невозможно курсором "путешествовать" по таблице. Помогите, пожалуйста, что я сделал не так? Незнаю как вложить файл, но вот код
<html>
<head>
<title>Новое Меню на сайт</title>
<style>
.poisk {
width: 156px;
height: 16px;
border: 0px solid red;
}
</style>
<LINK href="menu/layout.css" rel=stylesheet>
</head>
<body leftmargin="0" topmargin="0"><table><tr><td width="1000" height="470" align="center">Здесь еще одна таблица</td></tr></table>
<style>
A {color:black; text-decoration: none}
A:hover {color:black; text-decoration: none}
</style>
<style type="text/css">
body {
font-family: Arial;
}
.tab {
cursor: pointer;
}
.show {
display: none;
position: relative;
width: 1000px;
height: 100px;
top: -3px;
left: px;
color: red;
font-size: 18px;
font-weight: bold;
}
.show1 {
display: none;
position: relative;
top: -3px;
left: 250px;
width: 1000px;
height: 100px;
color: red;
font-size: 18px;
font-weight: bold;
}
</style>
<script type="text/javascript">
function show_div ( id ) {
var divs = document.getElementsByTagName('div');
for ( var i = 0; i < divs.length; i ++ ) {
var div = divs.item(i);
if ( /show/.test( div.className ) ) {
if ( div.id == id ) {
div.style.display = 'block';
} else {
div.style.display = 'none';
}
}
}
}
function hide_div ( id ) {
var divs = document.getElementsByTagName('div');
for ( var i = 0; i < divs.length; i ++ ) {
var div = divs.item(i);
if ( /show/.test( div.className ) ) {
if ( div.id == id ) {
div.style.display = 'none';
} else {
div.style.display = 'none';
}
}
}
}
function hide_div1 ( id ) {
var divs = document.getElementsByTagName('div');
for ( var i = 0; i < divs.length; i ++ ) {
var div = divs.item(i);
if ( /show/.test( div.className ) ) {
if ( div.id == id ) {
div.style.display = 'none';
} else {
div.style.display = 'none';
}
}
}
}
</script>
<div><center><tr><td><table valign="top" cellspacing="0" cellpadding="0"><tr><td><span class="tab" onmouseover="show_div('one')" onmouseout="hide_div1('one')"><img src="prod.jpg" border="0"></span><a href="http://www.arsenal-npo.ru/price/"><img src="price.jpg" border="0"><span class="tab" onmouseover="show_div('three')" onmouseout="hide_div1('three')"><img src="doc.jpg" border="0"></span><span class="tab" onmouseover="show_div('three')" onmouseout="hide_div1('three')"><img src="po.jpg" border="0"></span><a href="http://www.arsenal-npo.ru/video/"><img src="video.jpg" border="0"></a><a href=""><img src="im.jpg" border="0"></a><a href=""><img src="proekts.jpg" border="0"></a><a href=""><img src="kontr_proizv.jpg" border="0"></a></td></tr></table></td></tr></table></center></div>
<center><div class="show" id="one" onmouseover="show_div('one')" onmouseout="hide_div1('one')">
<TABLE WIDTH="974" BORDER=2 bordercolor="004fd0" CELLSPACING=0 CELLPADDING=0>
<TR>
<td ALIGN="center" bgcolor="ee9a85"><font size="1" face="verdana"><b><a href=""> </a></b></td>
<TD ALIGN="center" bgcolor="f7c6b7"><font size="1" face="verdana"><b> </b></TD>
<TD ALIGN="center" bgcolor="f4e7d7"><font size="1" face="verdana"><b> </b></TD>
<TD ALIGN="center" bgcolor="f4e7d7"><font size="1" face="verdana"><b> </b></TD>
<TD ALIGN="center" bgcolor="f4e7d7"><font size="1" face="verdana"><B> <b></TD>
<TD ALIGN="center" bgcolor="fae1b9"><font size="1" face="verdana"><B> </b></TD>
<TD ALIGN="center" bgcolor="fae1b9"><font size="1" face="verdana"><b> </b></TD>
<TD ALIGN="center" bgcolor="f7c592"><font size="1" face="verdana"><b> </B></TD>
<TD ALIGN="center" bgcolor="ef9968"><font size="1" face="verdana"><b> </b></TD>
</TR>
<TR>
<TD ALIGN="center"><a href="input_page/iz.php"><img src="vyp_menu_10.jpg" border="0"></a></TD>
<TD ALIGN="center"><img src="vyp_menu_11.jpg" border="0"></TD>
<TD ALIGN="center"><img src="vyp_menu_12.jpg" border="0"></TD>
<TD ALIGN="center"><img src="vyp_menu_13.jpg" border="0"></TD>
<TD ALIGN="center"><img src="vyp_menu_14.jpg" border="0"></TD>
<TD ALIGN="center"><img src="vyp_menu_15.jpg" border="0"></TD>
<TD ALIGN="center"><img src="vyp_menu_16.jpg" border="0"></TD>
<TD ALIGN="center"><img src="vyp_menu_17.jpg" border="0"></TD>
<TD ALIGN="center"><img src="vyp_menu_18.jpg" border="0"></TD>
</TR>
<TR>
<TD ALIGN="center" bgcolor="ee9a85"><font size="1" face="verdana"><b> </b></TD>
<TD ALIGN="center" bgcolor="f7c6b7"><font size="1" face="verdana"><b> </b></TD>
<TD ALIGN="center" bgcolor="f4e7d7"><font size="1" face="verdana"><b> </b></TD>
<TD ALIGN="center" bgcolor="f4e7d7"><font size="1" face="verdana"><b> </b></TD>
<TD ALIGN="center" bgcolor="f4e7d7"><font size="1" face="verdana"><b> </b></TD>
<TD ALIGN="center" bgcolor="fae1b9"><font size="1" face="verdana"><b> </b></TD>
<TD ALIGN="center" bgcolor="fae1b9"><font size="1" face="verdana"><b> </b></TD>
<TD ALIGN="center" bgcolor="f7c592"><font size="1" face="verdana"><b> </b></TD>
<TD ALIGN="center" bgcolor="f7c592"><font size="1" face="verdana"><b> </b></TD>
</TR>
<TR>
<TD ALIGN="center"><img src="vyp_menu_28.jpg"></TD>
<TD ALIGN="center"><img src="vyp_menu_29.jpg"></TD>
<TD ALIGN="center"><img src="vyp_menu_30.jpg"></TD>
<TD ALIGN="center"><img src="vyp_menu_31.jpg"></TD>
<TD ALIGN="center"><img src="vyp_menu_32.jpg"></TD>
<TD ALIGN="center"><img src="vyp_menu_33.jpg"></TD>
<TD ALIGN="center"><img src="vyp_menu_34.jpg"></TD>
<TD ALIGN="center"><img src="vyp_menu_35.jpg"></TD>
<TD ALIGN="center"><img src="vyp_menu_36.jpg"></TD>
</TR>
</TABLE></font></center>
</div>
<div class="show1" id="two"></div>
<div class="show1" id="three" onmouseover="show_div('three')" onmouseout="hide_div1('three')">
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td><img src="po.jpg"></td>
</tr>
<tr>
<td><img src="doc.jpg"></td>
</tr>
</div>
</body>
</html>