Перейти к содержимому

Сервис обмена электронных валют

Выбрать шаблон и создать сайт

  • Закрытая тема Тема закрыта

CSS меню в IE

#1 LOla

LOla
  • Пользователь
  • 70 сообщений
  • Репутация: 0
0

Отправлено 23 Ноябрь 2009 - 13:23

Здравствуйте.
В сущности нужна помощь. Ситуация следующая, горизонтальное выпадающее меню не работает в ослике. Сама я в js ни бум бум, даже не знаю куда его вставлять в коде :blink: Помогите пожалуйста, плизззззз
Не знаю какой код лучше повесить, всей странички или только менюшки?

 

 

  • 0

#2 ZiTosS

ZiTosS
  • Пользователь
  • 5 148 сообщений
  • Репутация: 8

Отправлено 23 Ноябрь 2009 - 19:16

LOla, То вы говорите, что CS-меню, то на JS. Вы уже определитесь, а лучше выложите код менюшки + CSS к ней + JS к ней(если есть)
  • 0

#3 LOla

LOla
    Topic Starter
  • Пользователь
  • 70 сообщений
  • Репутация: 0

Отправлено 24 Ноябрь 2009 - 00:42

LOla, То вы говорите, что CS-меню, то на JS. Вы уже определитесь, а лучше выложите код менюшки + CSS к ней + JS к ней(если есть)

Ну меню то css, а JS для ослика, но у меня как то криво всё это стоит. Ща покажу.
вот html
<div id="nav">
<ul class="nav">
<li><a href="weimarbavarka1.html">ГЛАВНАЯ </a>
<ul>
<li><a href="nev.html">Новости</a></li>
<li><a href="onas.html">О нас</a></li>
</ul>
</li>
<li><a href="porodi.html">ПОРОДЫ </a>
<ul>
<li><a href="bavarka1.html">Баварская <br />
гончая</a></li>
<li><a href="weimar1.html">Веймаранер</a></li>
</ul>
</li>
<li><a href="stati.html">СТАТЬИ</a>
<ul>
<li><a href="#null">Дрессировка</a></li>
<li><a href="#null">Уход и<br />
содержание</a></li>
</ul>
</li>
<li><a href="#null">ВИДЕО</a>
<ul>
<li><a href="#null">Видео <br />
дрессировки</a></li>
<li><a href="#null">Разное</a></li>
</ul>
</li>
<li><a href="#null">ГАЛЕРЕЯ</a></li>
<li><a href="deti.html">ЩЕНКИ</a>
<ul>
<li><a href="#null">Уход за щенком</a></li>
<li><a href="#null">Купить
щенка</a></li>
</ul>
</li>
<li><a href="#null">КОНТАКТЫ </a>
<ul>
<li><a href="#null">Карта сайта</a></li>
<li><a href="#null">Ссылки</a></li>
</ul>
</li>
</ul></div>


вот css
#nav{
width:980px;
height:100px;
background-image: url(html/images/fon-menu.jpg);
margin: 0;
position:relative;
z-index:3;
}

.nav ul {
  list-style: none;
  margin: 0;
  padding:0;
  float: left;
  width: 980px;
  list-style-type:none;  
}

.nav li {
  float: left;
  list-style-type:none;
  height:40px;
  position: relative;
  background: none;
}
.nav li ul {
  display: none;
}
.nav a {
  color: #FF6600;
  text-decoration: none; 
  font-family:  Geneva, Arial, Helvetica, sans-serif;
  font-weight:bold;
  display: block;
  width: 110px;
  padding: 10px 10px 10px 20px;
  background-image: url(html/images/knopka1.gif);
  background-repeat:no-repeat;
  border:none;
  margin:0;
 }  
.nav a:hover {
  color: #006600;
  background-image: url(html/images/knopka-2.gif);
  height:40;
  background-repeat:no-repeat;
  border:none;
  margin:0;
 }
.nav li ul {
  display: none;
}
.nav li ul {
  display: none;
  position: absolute;
  background-color:#d3ebeb;
  padding:0;
  margin:0;
  width: 140px;
  height:40;
  border:0;
}
.nav li ul a{font-size:14px;
line-height:11px;
padding-top:10px;
padding-right:10px;
padding-bottom:21px;
padding-left:20px;

}
.nav li li a {
  width: 140px;
  height:avto;
  background:none;
}

.nav li:hover ul {
  display: block;
}

.nav li:hover,
.nav li.jshover {
   /*оформление при наведении первого уровня*/
}

.nav li:hover ul,
.nav li.jshover ul {
   /*оформление списка UL для дочерних при наведении на первый уровень*/
}

.nav li:hover li ul,
.nav li.jshover li ul {
   /*оформление дочерних*/
}

.nav li:hover li:hover ul,
.nav li.jshover li.jshover ul {
   /*оформление при наведении дочерних*/
}

а это js который я использовала, но мне кажется там что то не так. Прямо смайлика мне у вас не хватает. Везде надо ставить краснеюий.
function initPage()
{
var nav = document.getElementById("menu");
if (nav)
{
 var nodes = nav.getElementsByTagName("li");
 for (var i = 0; i < nodes.length; i++)
 {  
   nodes[i].onmouseover = function () 
   {
	this.className += " hover";
   }
   nodes[i].onmouseout = function ()
   {
	this.className = this.className.replace(" hover", "");
   }
 }
}
}
if (window.attachEvent) window.attachEvent("onload", initPage);

  • 0

#4 ZiTosS

ZiTosS
  • Пользователь
  • 5 148 сообщений
  • Репутация: 8

Отправлено 24 Ноябрь 2009 - 13:12

LOla,
Вообщем код немного не тот. Вам надо так:
<html>
<head>
<!-- подключаем css -->

<script type="text/javascript">
function initPage()
{
var nav = document.getElementById("nav"); //находим наше меню
/* если меню нашлось*/
if (nav)
{
var nodes = nav.getElementsByTagName("li"); // отбираем все узлы с именем тега "li"
/* обходим все их в цикле */
for (var i = 0; i < nodes.length; i++)
{
/* назначаем i-му элементу обработчик при наведении */
nodes[i].onmouseover = function ()
{
this.className += " jshover"; // прибавляем в конец class " jshover"
}
/* назначаем i-му элементу обработчик при снятии наведения */
nodes[i].onmouseout = function ()
{
this.className = this.className.replace(" jshover", ""); // удаляем из class " jshover"
}
}
}
}

if (window.attachEvent) window.attachEvent("onload", initPage); // инициализируем вызов функции initPage при загрузке документа
</script>
</head>
<body>
<!-- Всё содержимое контента -->
</body>
</html>


А вообще JS код можно выность за содержимое документа. А в документе просто подключать его таким образом:
<script type="text/javascript" src="file.js"></script>

Главное правильно указать путь до файла (по этому поводу разжевывал на форуме)
И не забываем что в JS-файле должен быть только код JS, без всяких там HTML-тегов.
  • 0

#5 LOla

LOla
    Topic Starter
  • Пользователь
  • 70 сообщений
  • Репутация: 0

Отправлено 24 Ноябрь 2009 - 19:35

Мама дорогая!!!!! Заработало!!!! Не знаю как громче ещё кричать!!!! УРА УРА УРА!!!
Да Здравствует Великий ZiTosS!!!!
Безмерно вам благодарна, а то уже примерно месяц не могла с этим ни чего поделать.
Пошла учить как указывать путь к файлу.
Блин, не знаю где тут кнопка Спасибо.
  • 0

#6 ZiTosS

ZiTosS
  • Пользователь
  • 5 148 сообщений
  • Репутация: 8

Отправлено 24 Ноябрь 2009 - 22:04

LOla, Всегда пожалуйста.
p.s.: Кнопка "спасибо", если что, в левом столбце , где информация о пользователе(аватарка, группа, статус и etc.), в самом низу.
  • 0

#7 LOla

LOla
    Topic Starter
  • Пользователь
  • 70 сообщений
  • Репутация: 0

Отправлено 24 Ноябрь 2009 - 23:31

LOla, Всегда пожалуйста.
p.s.: Кнопка "спасибо", если что, в левом столбце , где информация о пользователе(аватарка, группа, статус и etc.), в самом низу.

Это та на которой написано Жалоба? :D :blink:
  • 0

#8 ZiTosS

ZiTosS
  • Пользователь
  • 5 148 сообщений
  • Репутация: 8

Отправлено 24 Ноябрь 2009 - 23:57

LOla, Нет, чуть правее :blink:

P.s.: Тему закрываю, так как опрос решён
  • 0

robot

robot
  • Пользователь PRO
  • 2 652 сообщений
  • Репутация: 85


Оформление форума – IPBSkins.ru