Реклама на сайте Advertise with us
Advertise with us
Размещение рекламы
Главная » Форум » Программинг, Скрипты, Софт, Сервисы »

Древовидное меню на JS

 Расширенный поиск по форуму
 
Новая тема Новая тема   
Автор
Поиск в теме:

programmer

С нами с 08.12.02
Сообщения: 7607
Рейтинг: 5752
Ссылка на сообщениеДобавлено: 11/07/07 в 09:38       Ответить с цитатойцитата 
подкитньте кроссбраузерный пример
меню с плюсиком напротив пункта, жмешь открываются соподчиненные пункты, плюсик на минус меняется, жмешь на минус - меню принимает первоначальный вид
+8

крипта на ByBit

0
 



С нами с 30.06.07
Сообщения: 30
Рейтинг: 78
Ссылка на сообщениеДобавлено: 11/07/07 в 10:19       Ответить с цитатойцитата 
если у тебя только два уровня вложенности, то рекомендую делать без JS только с CSS примерно вот так:

Код:
<html><head>
<style type=text/css>
body { font-size: 12px; font-family: Tahoma; }
#nav li.mpop li.mit a { background:#f0f0f0;text-decoration:none; display: block; font-weight: normal; color: black; padding: 5px 2px 5px 5px; text-align:left; font-size: 11px;}
#nav li.mpop li.mit a:hover { background:gray; color:black; }
#nav li.mpop li.mit { background:cyan; border-right:1px solid #CCC; }
ul.nav { list-style:none; padding:0; margin:0; }
li.mpop { cursor:hand;position: relative; text-align: center; background-color:#f0f0f0; padding:5}
li.mpop a { text-decoration:none; }
li.mpop:hover,li.mpop:hover a { background:lightblue; color:black; }
li.mpop ul.mit { display: none; position: relative; top:100%; left:0; width:100%;font-weight: normal; border-bottom: solid 1px #999; }
li.mpop>ul.mit { top: auto; left: auto; }
li.mpop li.mit { display: block; float: none; background-color: transparent; border-left: 1px solid #999; }
li.mpop:hover ul.mit, li.over ul.mit { padding:0; margin-top:5; margin-left:35;display:block }
</style>
</head>
<body>

<ul id=nav style='float:left; width:20%'>
<li class=mpop>
  <a href="0.php">Меню 1</a>
  <ul class=mit>
    <li class=mit><a href="1.php">Пункт</a></li>
    <li class=mit><a href="2.php">Пунктик</a></li>
    <li class=mit><a href="3.php">Пунктище</a></li>
  </ul>
</li>
<li class=mpop>
  <a href="0.php">Меню 2</a>
  <ul class=mit>
    <li class=mit><a href="1.php">Белый</a></li>
    <li class=mit><a href="2.php">Зеленый</a></li>
    <li class=mit><a href="3.php">Прозрачный</a></li>
    <li class=mit><a href="4.php">Рыжий</a></li>
    <li class=mit><a href="5.php">Ржавый</a></li>
    <li class=mit><a href="6.php">Голубенькый</a></li>
    <li class=mit><a href="7.php">Полосатый</a></li>
  </ul>
</li>
<li class=mpop>
  <a href="0.php">Меню 3</a>
  <ul class=mit>
    <li class=mit><a href="1.php">Привет</a></li>
    <li class=mit><a href="2.php">Здравствуйте</a></li>
    <li class=mit><a href="3.php">Ой вы гой еси</a></li>
    <li class=mit><a href="4.php">Hi</a></li>
    <li class=mit><a href="5.php">'Lo</a></li>
  </ul>
</li>
</ul>
</body></html>

8
 

programmer

С нами с 08.12.02
Сообщения: 7607
Рейтинг: 5752
Ссылка на сообщениеДобавлено: 11/07/07 в 10:30       Ответить с цитатойцитата 
к сожалению требование такое- с крестиками

крипта на ByBit

0
 



С нами с 30.06.07
Сообщения: 30
Рейтинг: 78
Ссылка на сообщениеДобавлено: 11/07/07 в 10:59       Ответить с цитатойцитата 
xttp://www.codespy.com/javascriptfoldertree.html

8
 



С нами с 21.06.05
Сообщения: 1788
Рейтинг: 1579
Ссылка на сообщениеДобавлено: 11/07/07 в 11:35       Ответить с цитатойцитата 
dhtmlgoodies.com

ВОСТОРГ ЗНАЧИТ BMW

0
 



С нами с 21.06.05
Сообщения: 1788
Рейтинг: 1579
Ссылка на сообщениеДобавлено: 11/07/07 в 11:41       Ответить с цитатойцитата 
forum.dklab.ru/js/advises/ProjectCompleteMenuSolution.html

ВОСТОРГ ЗНАЧИТ BMW

0
 
Новая тема Новая тема   

Текстовая реклама в форме ответа
Заголовок и до четырех строчек текста
Длина текста до 350 символов
Купить рекламу в этом месте!


Перейти:  



Спонсор раздела Стань спонсором этого раздела!

Реклама на сайте Advertise with us

Опросы

Рецепт новогоднего блюда 2022



Обсудите на форуме обсудить (11)
все опросы »


© Master-X, 1999-2024