Выпадающее меню .inc

beetljuice · November 22, 2010

Доброго времени суток!

Очень нужна помощь, ковыряюсь уже несколько дней и все без результатно(((

На странице сделано выпадающее меню, прописано оно в файлике .inc, оно прекрасно работает во всех браузерах кроме IE!

Я нашел скрипт для того чтобы оно работало в IE, добавил его прописал пути, но все тщетно, что делать уже не знаю, даже не очень понимаю где искать помогите пожалуйста!

Index1.html

<html>
<head>
.......................................
<script type="text/javascript" src="cssmenu.js"></script>
<link rel="shortcut icon" href="images/lapa.gif">

<link href="css/style.css" rel="stylesheet" type="text/css">
<link href="css/style_top.css" rel="stylesheet" type="text/css">
<link href="css/style_bottom.css" rel="stylesheet" type="text/css">
</head>
.......................................
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="menu">
<tr><td height="29"></td></tr>
<tr>
<!--навигация (каталог)-->
<!--#include virtual="inc/menu_katalog.inc" -->
<!--КОНЕЦ навигации-->
</tr>
<!--конец каталога-->
</table>
.......................................

inc/menu_katalog.inc

<td class="mitem1">
<a href="dogs.html">Товары для собак</a></td></tr> 
<tr><td>
<div class="mitem">
<ul id="nav">
<ul>
<li><a href="dry.html"><img src="images/bull.gif" alt="сухой корм для собак" title="сухой корм для собак" width="11" height="9"> Сухой корм</a>
<ul> 
<li><a href="darling.html"><img src="images/bull.gif" alt="" width="11" height="9"> Darling</a></li> 
<li><a href="dog_chow.html"><img src="images/bull.gif" alt="" width="11" height="9"> Dog Chow</a></li> 
<li><a href="hills.html"><img src="images/bull.gif" alt="" width="11" height="9"> Hill's</a></li> 
<li><a href="pro_plan.html"><img src="images/bull.gif" alt="" width="11" height="9"> Purina Pro Plan</a></li>
<li><a href="royal_dog.html"><img src="images/bull.gif" alt="" width="11" height="9"> Royal Canin</a></li> 
</ul></li> 
<li><a href="canned.html"><img src="images/bull.gif" alt="" width="11" height="9"> Консервы</a> 
<ul> 
<li><a href="hills.html"><img src="images/bull.gif" alt="" width="11" height="9"> Hill's</a></li> 
<li><a href="pro_pac.html"><img src="images/bull.gif" alt="" width="11" height="9"> Pro Pac</a></li> 
<li><a href="purina.html"><img src="images/bull.gif" alt="" width="11" height="9"> Purina</a></li> 
</ul></li>
<li><a href="delicacy.html"><img src="images/bull.gif" alt="" width="11" height="9"> Лакомства </a> 
<ul> 
<li><a href="hills.html"><img src="images/bull.gif" alt="" width="11" height="9"> Hill's</a></li> 
<li><a href="pro_pac.html"><img src="images/bull.gif" alt="" width="11" height="9"> Pro Pac</a></li> 
<li><a href="purina.html"><img src="images/bull.gif" alt="" width="11" height="9"> Purina</a></li> 
</ul> 
</li> 
<li><a href="accessory.html" class="brd"><img src="images/bull.gif" alt="" width="11" height="9"> Акссесуары</a>
<ul> 
<li><a href="hills.html"><img src="images/bull.gif" alt="" width="11" height="9"> Hill's</a></li> 
<li><a href="pro_pac.html"><img src="images/bull.gif" alt="" width="11" height="9"> Pro Pac</a></li> 
<li><a href="purina.html"><img src="images/bull.gif" alt="" width="11" height="9"> Purina</a></li> 
</ul></li> 
</ul></div>
</td></tr>
<tr><td height="20" align="left"></td></tr>
<tr><td height="20" align="left"></td></tr>
<tr><td class="mitem1"><a href="cats.html">Товары для кошек</a></td></tr> 
<tr><td>
<div class="mitem">
<ul>
<li><a href="dry.html"><img src="images/bull.gif" alt="" width="11" height="9"> Сухой корм</a>
<ul> 
<li><a href="hills.html"><img src="images/bull.gif" alt="" width="11" height="9"> Hill's</a></li> 
<li><a href="pro_pac.html"><img src="images/bull.gif" alt="" width="11" height="9"> Pro Pac</a></li> 
<li><a href="purina.html"><img src="images/bull.gif" alt="" width="11" height="9"> Purina</a></li> 
</ul></li>
<li><a href="canned.html"><img src="images/bull.gif" alt="" width="11" height="9"> Консервы</a> 
<ul> 
<li><a href="hills.html"><img src="images/bull.gif" alt="" width="11" height="9"> Hill's</a></li> 
<li><a href="pro_pac.html"><img src="images/bull.gif" alt="" width="11" height="9"> Pro Pac</a></li> 
<li><a href="purina.html"><img src="images/bull.gif" alt="" width="11" height="9"> Purina</a></li>
</ul></li> 
<li><a href="delicacy.html"><img src="images/bull.gif" alt="" width="11" height="9"> Лакомства </a> 
<ul> 
<li><a href="hills.html"><img src="images/bull.gif" alt="" width="11" height="9"> Hill's</a></li> 
<li><a href="pro_pac.html"><img src="images/bull.gif" alt="" width="11" height="9"> Pro Pac</a></li> 
<li><a href="purina.html"><img src="images/bull.gif" alt="" width="11" height="9"> Purina</a></li> 
</ul></li> 
<li><a href="accessory.html" class="brd"><img src="images/bull.gif" alt="" width="11" height="9">Акссесуары </a>
<ul> 
<li><a href="hills.html"><img src="images/bull.gif" alt="" width="11" height="9"> Hill's</a></li> 
<li><a href="pro_pac.html"><img src="images/bull.gif" alt="" width="11" height="9"> Pro Pac</a></li> 
<li><a href="purina.html"><img src="images/bull.gif" alt="" width="11" height="9"> Purina</a></li>
</ul></li></ul></div></td>

style_bottom.css

.bgx {
background-repeat: repeat-x}
.bgy {
background-repeat: repeat-y}
.bgnr{
background-repeat: no-repeat}
.top1{
background-repeat: no-repeat;
padding: 3px 30px 10px 10px; 
}
.top2{

padding: 3px 30px 10px 10px; 
}
.title {padding-left:25px;
padding-top:20px}
.content {padding: 20px 30px 10px 25px; 
text-align:justify}
.menu a {
color:#000000;
margin-right:20px}
.mitem {
padding-left:20px;
}
.mitem ul {
width: 130px; /* Ширина меню */
list-style: none; /* Для списка убираем маркеры */
margin: 0; /* Нет отступов вокруг */
padding: 0; /* поля вокруг текста */
font-family: Arial, Helvetica, sans-serif; /* Рубленый шрифт для текста меню */
font-size: 12px; /* Размер названий в пункте меню */
font-weight: norm;
}
.mitem ul li {
position: relative;
}
.mitem li ul {
position: absolute; /* Подменю позиционируются абсолютно */
display: none; /* Скрываем подменю */
padding: 0; /* поля вокруг текста */
margin-left: 105px; /* Сдвигаем подменю вправо */
margin-top: -2em; /* Сдвигаем подменю вверх */
background-color:#ffffff
}
.mitem li a {
display: block; /* Ссылка как блочный элемент */
padding: 5px; /* Поля вокруг надписи */
text-decoration: none; /* Подчеркивание у ссылок убираем */
color: #000000; /* Цвет текста */
border: 0px solid #ccc; /* Рамка вокруг пунктов меню */
border-bottom: 1px solid #000000; /* Границу снизу не проводим */
}
.mitem li a:hover {
color: #000000; /* Цвет текста активного пункта */
background-color: #bee6a7; /* Цвет фона активного пункта */
}
.mitem li:hover ul { 
display: block; /* При выделении пункта курсором мыши отображается подменю */
}
.mitem li:hover ul, li.over ul { 
display: block;
}
/* Fix IE. Hide from IE Mac \*/
* html ul li { float: left; }
* html ul li a { height: 1%; }
/* End */
/* Fix IE. Hide from IE Mac \*/
* html ul li { float: left; height: 1%; }
* html ul li a { height: 1%; }
/* End */
.mitem1 {
font-size: 14px;
padding-left:10px;
font-weight: bold;
color: #000000;
}
.logo h1 {
color:#348D00;
font-size: 15px;
}
.menu-head1 {
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
color: #ff6600;
text-decoration: none;
font-weight: normal;
}
a.menu-head1:link, 
a.menu-head1:visited {
color: #ff6600;
text-decoration: none;
font-weight: normal;
margin-bottom: 2px;
}
a.menu-head1:hover, 
a.menu-head1:active {
color: #ff6600;
}
.navlist {
padding: 2px 20px 0px 20px; 
color:#000000; 
font-size:14px; 
text-align:center;
font-weight: bold;
text-decoration: none;
}
a.navlist { 
padding: 3px 10px 10px 10px; 
color:#000000; 
font-size:14px; 
padding-left:20px; 
text-decoration: none;
}
a.navlist:visited {
color: #000000;
text-decoration: none;
}
a.navlist:hover {
color: #50902c;
text-decoration: none;
padding-left:20px;
}
a.navlist:active {
color: #50902c;
}
.navlist1 {
padding: 2px 20px 0px 20px; 
color:#50902c; 
font-size:14px; 
text-align:center;
font-weight: bold;
text-decoration: none;
}
a.navlist1 { 
padding: 3px 10px 10px 10px; 
color:#50902c; 
font-size:14px; 
padding-left:20px; 
text-decoration: none;
}
.news{
width:150px;
padding-left: 15px;
padding-top: 0px;
padding-right: 5px;
padding-bottom: 2px;
font-size:11px;
border-left:1px solid #50902c;
}
.foto{
text-align:center;
padding-left: 2px;
padding-top: 15px;
padding-right: 10px;
padding-bottom: 20px;
color:#323232;
font-size: 11px;
font-weight: normal;
}
.links {
font-family: Arial, Helvetica, sans-serif;
padding-left: 10px;
padding-bottom: 20px;
font-size: 11px;
font-weight: normal;
font-style: italic;
color: #323232;
}
a.links:link, 
a.links:visited {

color: #323232;
text-decoration: none;
font-weight: normal;
margin-bottom: 2px;
}
a.links:hover, 
a.links:active {
color: #50902c;
}

cssmenu.js

startList = function() {
if (document.all&&document.getElementById) {
navRoot = document.getElementById("nav");
for (i=0; i<navRoot.childNodes.length; i++) {
node = navRoot.childNodes[i];
if (node.nodeName=="LI") {
node.onmouseover=function() {
this.className+=" over";
}
node.onmouseout=function() {
this.className=this.className.replace 
(" over", "");
}
}
}
}
}
window.onload=startList;

Edited November 23, 2010 by beetljuice

Vlad · November 22, 2010

Поместите код в специальные теги [ codebox ] и [ /codebox ] без пробелов между скобок.

Sign In

Выпадающее меню .inc

Question

beetljuice

Link to comment

Share on other sites

1 answer to this question

Recommended Posts

Vlad

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information