Модераторы: Sardar, Aliance
  

Поиск:

Ответ в темуСоздание новой темы Создание опроса
> Раскрывающееся меню 
V
    Опции темы
ursula16
Дата 24.7.2007, 10:34 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Новичок



Профиль
Группа: Участник
Сообщений: 35
Регистрация: 4.7.2007

Репутация: нет
Всего: нет



Доброго времени суток! В общем есть меню типа
Код

<a href=mobiles.php>Мобильные телефоны</a><br>
<a href=tvs>Телевизоры</a><br>
<a href=computers>Компьютеры</a><br>

Как сделать,чтобы при нажатии на ссылку(onClick) под ней появлялись пункты подменю? И чтобы при повторном onClick все сворачивалось? Еще необходимо запоминать какой пункт меню раскрыт... Хелп плс...  smile 
PM MAIL   Вверх
Rigel
Дата 24.7.2007, 11:58 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Шустрый
*


Профиль
Группа: Участник
Сообщений: 122
Регистрация: 24.7.2007
Где: Москва

Репутация: нет
Всего: нет



Во-первых, зачем запоминать? Сворачивай все, потом развернешь нужный. 
Как сделать, чтобы появлялись подменю? Сначала их нужно выложить, со стилем display:none; причем все в одно место. Невидимки для форматирования не имеют размера, и в любой контейнер можно напихать их сколько угодно. Ну а потом - обходишь их все подряд и ставишь у нужного тебе display:block; 
Выпадающее меню - несложная штука. Вытяни пример из моего сайта (адрес в подписи), он строится системой администрирования из SQL-таблицы, но для примера это значения не имеет, разве что скрипт у меня жесткий, пересоздающий файлы при изменении таблицы, потому что проще посчитать один раз, при создании js-файла, чем крутить цикл скриптом на каждом клиенте. smile 
--------------------
С уважением. Rigel. http://www.smoliy.ru
PM MAIL WWW ICQ   Вверх
ursula16
Дата 25.7.2007, 07:40 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Новичок



Профиль
Группа: Участник
Сообщений: 35
Регистрация: 4.7.2007

Репутация: нет
Всего: нет



Спс,как создать сами блоки я знаю... Интересует как написать функцию, чтобы при первом нажатии onClick меню раскрывалось, а при повторном закрывалось...  smile 
PM MAIL   Вверх
Rigel
Дата 25.7.2007, 10:26 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Шустрый
*


Профиль
Группа: Участник
Сообщений: 122
Регистрация: 24.7.2007
Где: Москва

Репутация: нет
Всего: нет



Вот функция с моего сайта (точнее, ее кусочек)
function wmen(wdis) 
 {
document.getElementById('ul14').style.display='none'; 
 if(wdis == 14){document.getElementById('ul14').style.display='block';} 
document.getElementById('ul6').style.display='none'; 
 if(wdis == 6){document.getElementById('ul6').style.display='block';} 
} 

function wdon() 
 {
document.getElementById('ul14').style.display='none';
document.getElementById('ul6').style.display='none';
} 

А вот ее вызов:
<div class="uk14" id="uk14">
<a href="index.php" onMouseOver="javascript:wmen(14)" class="mmnuit">Главная</a>
</div>
<div class="uk6" id="uk6">
<a href="poemlst.php" onMouseOver="javascript:wmen(6)" class="mmnuit">Стихи</a>
</div>
<div class="ul6" id="ul6">
<a href="poemass.php" class="sm1" target="_top">Сборники</a>
<a href="poems.php" class="sm1" target="_top">В&nbsp;порядке&nbsp;поступления</a>
<a href="allpoem.php" class="sm1" target="_top">Одним&nbsp;файлом</a>
</div>
<div class="ul7" id="ul7">
<a href="portfolio.php" class="sm1" target="_top">Портфолио</a>
<a href="album.php?a=2" class="sm1" target="_top">Зарисовки-Подмосковье</a>
<a href="album.php?a=1" class="sm1" target="_top">Зарисовки-Москва</a>
<a href="album.php?a=3" class="sm1" target="_top">Зарисовки-Прочее</a>
<a href="album.php?a=4" class="sm1" target="_top">Портреты</a>
<a href="album.php?a=5" class="sm1" target="_top">Черно-белые</a>
<a href="album.php?a=6" class="sm1" target="_top">Технические&nbsp;серии</a>
<a href="cycphoto.php" class="sm1" target="_top">Циклы&nbsp;фотографий</a>
<a href="palbum.php" class="sm1" target="_top">Последние&nbsp;поступления</a>
</div>

А внизу у этого меню полоса, пересечение мышки которой сворачивает меню:
<div class="dmenu">
<p align="center"><a href="#" onMouseOver="wdon()"><img src="img/nsel.gif" height="100%" width="100%" border=0></a>
</div>

Есть варианты меню без этой полосы, смотрите, например, на незаконченном сайте моей жены http://kora.tokamak.ru/ Там функция закрытия меню вызывается не по пересечению грызуном границы меню, а по onMouseOut, что, в принципе, реализуется столь же легко:
<div class=uk16>
<a href="menuh.php?men=16" onMouseOver="javascript:wmen(16)" onMouseOut="wdon()" class="mmnuit">О себе</a>
</div>
<div class=um16>
<a href="menuh.php?men=16" onMouseOver="javascript:wmen(16)" onMouseOut="wdon()" class="mmnuit"><img src=img/nsel.gif border=0 height= width=></a>
</div>
<table border=0 cellpadding=0 cellspacing=0 class=mtbl><tr class=mtbl><td bgcolor=#3c62ae class=mtbl><a href="palbum.php" onMouseOver="javascript:wmen(2)" onMouseOut="wdon()" class="sm1"><img src=img/nsel.gif height=9 width=100 border=0><br>&nbsp;Последние&nbsp;</a></td></tr>
<tr class=mtbl><td bgcolor=#3c62ae class=mtbl><a href="palbum.php?a=3" onMouseOver="javascript:wmen(2)" onMouseOut="wdon()" class="sm1"><img src=img/nsel.gif height=9 width=100 border=0><br>&nbsp;Детство&nbsp;</a></td></tr>
<tr class=mtbl><td bgcolor=#3c62ae class=mtbl><a href="palbum.php?a=1" onMouseOver="javascript:wmen(2)" onMouseOut="wdon()" class="sm1"><img src=img/nsel.gif height=9 width=100 border=0><br>&nbsp;О&nbsp;себе&nbsp;</a></td></tr>
<tr class=mtbl><td bgcolor=#3c62ae class=mtbl><a href="palbum.php?a=2" onMouseOver="javascript:wmen(2)" onMouseOut="wdon()" class="sm1"><img src=img/nsel.gif height=9 width=100 border=0><br>&nbsp;Раннее&nbsp;детство&nbsp;</a></td></tr>


Только ведь все это можно на сайте посмотреть - если воспользоваться функцией браузера "сохранить как", он вытянет все пристяжные файлы. Собственно, расчитывая на это я не привел пример в первый раз.  smile 

Это сообщение отредактировал(а) Rigel - 25.7.2007, 10:33
--------------------
С уважением. Rigel. http://www.smoliy.ru
PM MAIL WWW ICQ   Вверх
ursula16
Дата 25.7.2007, 12:42 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Новичок



Профиль
Группа: Участник
Сообщений: 35
Регистрация: 4.7.2007

Репутация: нет
Всего: нет



Спасибо большое, терь все понятно, сделано и работает  smile 
PM MAIL   Вверх
  
Ответ в темуСоздание новой темы Создание опроса
Форум для вопросов, которые имеются в справочниках, но их поиск вызвал затруднения, или для разработчика требуется совет или просьба отыскать ошибку. Напоминаем: 1) чётко формулируйте вопрос, 2) приведите пример того, что уже сделано, 3) укажите явно, нужен работающий пример или подсказка о том, где найти информацию.
 
0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема | JavaScript: Общие вопросы | Следующая тема »


 




[ Время генерации скрипта: 0.0428 ]   [ Использовано запросов: 22 ]   [ GZIP включён ]


Реклама на сайте     Информационное спонсорство

 
По вопросам размещения рекламы пишите на vladimir(sobaka)vingrad.ru
Отказ от ответственности     Powered by Invision Power Board(R) 1.3 © 2003  IPS, Inc.