Главная » 2009 » Сентябрь » 20 » раздвижное меню (Javascript)
20.09.2009, 16:10

раздвижное меню



Очень простой и эффективный раскрывающийся список. Значительно меньше списка на "куки". Работает, правда, только в Эксплорере, но в Нетскейпе он просто "вымирает" в список без особых неприятностей.

Это кидаем в head:

Code
<style type=text/css>
<!--
  body{background-color:#000000; font-family: MS Sans Serif, tahoma, Verdana, Arial; FONT-SIZE: 10px; color:#00E1FF}
  A { color :#00E1FF; FONT-FAMILY: verdana; FONT-SIZE: 8pt; text-decoration: none;}
  A:Hover { color :#FF0000; text-decoration: underline;}
-->

</style>

Это в body:

Code
<BODY BGCOLOR="#000000" TOPMARGIN="0" LEFTMARGIN="5" MARGINHEIGHT="0" MARGINWIDTH="5" >
<a NAME="1"></a>

<script language=JavaScript> function clickHandler() { var targetId, srcElement, targetElement; srcElement = window.event.srcElement; if (srcElement.className == "Outline") { targetId = srcElement.id + "details"; targetElement = document.all(targetId); if (targetElement.style.display == "none") { targetElement.style.display = ""; } else { targetElement.style.display = "none"; } }} document.onclick = clickHandler; </script>
<b id=Out1 class=Outline><font color="red">СКРИПТЫ</font></b><br><div id=Out1details style="display:None; position:relative; left:12;"></div>

<b id=Out2 class=Outline style="cursor: hand;">Меню</b><br>
<div id=Out2details style="display:None; position:relative; left:12;">
<img src="ball.gif" width=10 height=10 border=0><A HREF="#" TARGET="22">Выпад.с кнопкой</a>
<br><img src="ball.gif" width=10 height=10 border=0><A HREF="#" TARGET="22" >Выпад.без кнопки. </a>
<br><img src="ball.gif" width=10 height=10 border=0><A HREF="#"TARGET="22">Выпад. двухуровн.</a>
<br><img src="ball.gif" width=10 height=10 border=0><A HREF="#" TARGET="22">Выпад. графич.</a>

</div>

<b id=Out3 class=Outline style="cursor: hand;">Часы, таймеры</b><br>
<div id=Out3details style="display:None; position:relative; left:12;">
<img src="ball.gif" width=10 height=10 border=0><A HREF="#" TARGET="22">В текст.поле</a>
<br><img src="ball.gif" width=10 height=10 border=0><A HREF="#" TARGET="22">Номер 2</a>
<br><img src="ball.gif" width=10 height=10 border=0><A HREF="#" TARGET="22">Графические</a>
<br><img src="ball.gif" width=10 height=10 border=0><A HREF="#" TARGET="22">В статусн. стр.</a>

</div>

<b id=Out4 class=Outline style="cursor: hand;">Статусн. строка</b><br>
<div id=Out4details style="display:None; position:relative; left:12;">
<img src="ball.gif" width=10 height=10 border=0><A HREF="#" TARGET="22">Текст в строке.</a>
<br><img src="ball.gif" width=10 height=10 border=0><A HREF="#"TARGET="22">Мигание в строке.</a>
<br><img src="ball.gif" width=10 height=10 border=0><A HREF="#" TARGET="22">Бегущ. строка.</a>
<br><img src="ball.gif" width=10 height=10 border=0><A HREF="#" TARGET="22">Подсказ</a>
</div>

Ссылки на картинки и пункты меню правим на свои.

Материал взят с сайта infoscript.ru
Внимание! Копирование данного материала запрещено без указания ссылки на сайт Infoscript.ru
Источник/Автор: Неизвестен
Категория: JavaScript's | Просмотров: 2909 | Добавил: antisept | Рейтинг: 3.0/2 |
Теги: Раздвижное меню
Пока комментариев нет. Ты можешь быть первым!
Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]