imho.ws
IMHO.WS  

Вернуться   IMHO.WS > Веб-мастеру > Веб-программирование
Опции темы
Старый 19.02.2007, 13:33     # 1
3bepek
Newbie
 
Регистрация: 24.11.2006
Адрес: Москва, Пресня
Пол: Male
Сообщения: 26

3bepek Путь к славе только начался
помогите! меню на jave..

Есть вот такой код:
Код:
<DIV class="close" onClick="this.className='open';" onDblClick="this.className = 'close';">
<span class="menu_main">Раздел</span><br>
<a class="menu" href="#">1й пункт</a><br>
<a class="menu" href="#">2й пункт</a><br>
<a class="menu" href="#">3й пункт</a>
</DIV>
Стиль такой:
Код:
.close   {width: 130px; height: 14px; overflow: hidden;}
.open    {width: 130px; height: auto; overflow: visible;}
Т.е. мы имеем линк "Раздел", при нажатии на который открывается список пунктов. При двойном нажатии - исчезает.

Вопрос: Как сделать так, чтоб при повторном нажатии он исчезал (вместо двойного)

Заранее спасибо.
3bepek вне форума  
Старый 19.02.2007, 13:40     # 2
RaZEr
МОД-Оператор ЭВМ
 
Аватар для RaZEr
 
Регистрация: 18.04.2002
Адрес: Питер
Сообщения: 4 343

RaZEr Отец (мать) всех ГуруRaZEr Отец (мать) всех ГуруRaZEr Отец (мать) всех ГуруRaZEr Отец (мать) всех ГуруRaZEr Отец (мать) всех ГуруRaZEr Отец (мать) всех ГуруRaZEr Отец (мать) всех ГуруRaZEr Отец (мать) всех ГуруRaZEr Отец (мать) всех ГуруRaZEr Отец (мать) всех ГуруRaZEr Отец (мать) всех ГуруRaZEr Отец (мать) всех ГуруRaZEr Отец (мать) всех ГуруRaZEr Отец (мать) всех ГуруRaZEr Отец (мать) всех ГуруRaZEr Отец (мать) всех ГуруRaZEr Отец (мать) всех Гуру
this.className = (this.className == 'open')?'close':'open'
RaZEr вне форума  
Старый 19.02.2007, 14:13     # 3
3bepek
Newbie
 
Регистрация: 24.11.2006
Адрес: Москва, Пресня
Пол: Male
Сообщения: 26

3bepek Путь к славе только начался
все гениальное просто!!
Спасибо большое!!!!

добавлено через 19 минут
ой... тут такое дело....
а при нажатии на какой-нибудь "пункт меню" - раздел сворачивается..
нельзя как-нибудь сделать так, чтоб он сворачивался/разворачивался только при нажатии на "раздел"

и еще, если таких разделов несколько то как реализовать, чтоб при развернутом 1м разделе мы нажимаем на раздел 2 - и 2й раздел разворачивается, а первый сворачивается..

я в java скрипте не силен... так что сильно не пинайте.. ))
заранее спасибо!
3bepek вне форума  
Старый 19.02.2007, 15:37     # 4
Павел
Guest
 
Сообщения: n/a

<html>
<style type="text/css">
.list {width: 130px; height: 14px;}
.close {width: 130px; height: 1px; overflow: hidden;}
.open {width: 130px; height: auto; overflow: visible;}
</style>

<script language="JavaScript">
function ListOnClick()
{
var d = document.getElementById("List01");
d.className = (d.className == 'open')?'close':'open';
}
</script>

<body>

<DIV class="list" onClick="ListOnClick()">
<span class="menu_main">Раздел</span><br>
</DIV>
<DIV id="List01" class="close">
<a class="menu" href="#">1й пункт</a><br>
<a class="menu" href="#">2й пункт</a><br>
<a class="menu" href="#">3й пункт</a>
</DIV>
</body>
</html>
 
Старый 19.02.2007, 16:20     # 5
3bepek
Newbie
 
Регистрация: 24.11.2006
Адрес: Москва, Пресня
Пол: Male
Сообщения: 26

3bepek Путь к славе только начался
Спасибо!
А мне теперь для каждого раздела придется свою функцию прописать?
И как при разворачивании одного раздела заставить остальные свернуться?
3bepek вне форума  
Старый 19.02.2007, 17:11     # 6
Павел
Guest
 
Сообщения: n/a

Цитата:
Сообщение от 3bepek Посмотреть сообщение
Спасибо!
А мне теперь для каждого раздела придется свою функцию прописать?
И как при разворачивании одного раздела заставить остальные свернуться?
<html>
<style type="text/css">
.list {width: 130px; height: 14px;}
.close {width: 130px; height: 1px; overflow: hidden;}
.open {width: 130px; height: auto; overflow: visible;}
</style>

<script language="JavaScript">
var Lists = new Array;
Lists[0] = "List01";
Lists[1] = "List02";
Lists[2] = "List03";
function ListOnClick(ListID)
{
var d = document.getElementById(ListID);
d.className = (d.className == "open")?"close":"open";
for(i = 0; i < Lists.length; i++){
d1 = document.getElementById(Lists[i]);
if(d1.id != d.id) d1.className = "close";

}
}
</script>

<body>

<DIV class="list" onClick="ListOnClick('List01')">
<span class="menu_main">Раздел 1</span><br>
</DIV>
<DIV id="List01" class="close">
<a class="menu" href="#">1й пункт раздела 1</a><br>
<a class="menu" href="#">2й пункт раздела 1</a><br>
<a class="menu" href="#">3й пункт раздела 1</a>
</DIV>

<DIV class="list" onClick="ListOnClick('List02')">
<span class="menu_main">Раздел 2</span><br>
</DIV>
<DIV id="List02" class="close">
<a class="menu" href="#">1й пункт раздела 2</a><br>
<a class="menu" href="#">2й пункт раздела 2</a><br>
<a class="menu" href="#">3й пункт раздела 2</a>
</DIV>

<DIV class="list" onClick="ListOnClick('List03')">
<span class="menu_main">Раздел 3</span><br>
</DIV>
<DIV id="List03" class="close">
<a class="menu" href="#">1й пункт раздела 3</a><br>
<a class="menu" href="#">2й пункт раздела 3</a><br>
<a class="menu" href="#">3й пункт раздела 3</a>
</DIV>
</body>
</html>
 
Старый 19.02.2007, 17:21     # 7
3bepek
Newbie
 
Регистрация: 24.11.2006
Адрес: Москва, Пресня
Пол: Male
Сообщения: 26

3bepek Путь к славе только начался
Огромное спасибо!
Вот это то что надо!!


добавлено через 3 минуты
прочитал код - все понятно...
эх, надо javascript учить...
3bepek вне форума  
Старый 19.02.2007, 17:31     # 8
Павел
Guest
 
Сообщения: n/a

Учи лучше С++. Потом ни с Java ни с PHP проблем не будет.
 
Старый 19.02.2007, 18:53     # 9
RaZEr
МОД-Оператор ЭВМ
 
Аватар для RaZEr
 
Регистрация: 18.04.2002
Адрес: Питер
Сообщения: 4 343

RaZEr Отец (мать) всех ГуруRaZEr Отец (мать) всех ГуруRaZEr Отец (мать) всех ГуруRaZEr Отец (мать) всех ГуруRaZEr Отец (мать) всех ГуруRaZEr Отец (мать) всех ГуруRaZEr Отец (мать) всех ГуруRaZEr Отец (мать) всех ГуруRaZEr Отец (мать) всех ГуруRaZEr Отец (мать) всех ГуруRaZEr Отец (мать) всех ГуруRaZEr Отец (мать) всех ГуруRaZEr Отец (мать) всех ГуруRaZEr Отец (мать) всех ГуруRaZEr Отец (мать) всех ГуруRaZEr Отец (мать) всех ГуруRaZEr Отец (мать) всех Гуру
Между C++, Java и PHP огромная пропасть. Учить лучше то, на чём потом придётся писать. Куча мнений по этому поводу есть здесь: http://www.imho.ws/showthread.php?t=37035
RaZEr вне форума  
Старый 19.02.2007, 19:33     # 10
Павел
Guest
 
Сообщения: n/a

А я и не говорю что это одно и тоже. Просто если владеешь C++ выучить Java или PHP будет значительно проще.
 
Старый 19.02.2007, 19:38     # 11
RaZEr
МОД-Оператор ЭВМ
 
Аватар для RaZEr
 
Регистрация: 18.04.2002
Адрес: Питер
Сообщения: 4 343

RaZEr Отец (мать) всех ГуруRaZEr Отец (мать) всех ГуруRaZEr Отец (мать) всех ГуруRaZEr Отец (мать) всех ГуруRaZEr Отец (мать) всех ГуруRaZEr Отец (мать) всех ГуруRaZEr Отец (мать) всех ГуруRaZEr Отец (мать) всех ГуруRaZEr Отец (мать) всех ГуруRaZEr Отец (мать) всех ГуруRaZEr Отец (мать) всех ГуруRaZEr Отец (мать) всех ГуруRaZEr Отец (мать) всех ГуруRaZEr Отец (мать) всех ГуруRaZEr Отец (мать) всех ГуруRaZEr Отец (мать) всех ГуруRaZEr Отец (мать) всех Гуру
Причем здесь си? Просто потому что он тебе нравится?...
RaZEr вне форума  
Старый 19.02.2007, 19:53     # 12
Павел
Guest
 
Сообщения: n/a

Я имел в виду схожесть синтаксисов всех трех языков. И более ни чего.
 
Старый 01.09.2007, 16:43     # 13
h0ttab
Junior Member
 
Аватар для h0ttab
 
Регистрация: 10.05.2004
Сообщения: 49

h0ttab Мелкий засранец
А как сделать так чтоб выпадала в табличном дизайне
Код HTML:
<table>
<DIV class="list" onClick="ListOnClick()">
<tr>
<td class="links" colspan="2" background="/templates/vechorka/images/bgs_3.gif" height="20"><img src="/templates/vechorka/images/arr_4.gif" style="margin-left: 7px; margin-right: 21px;" alt="" height="5" width="5"><b><a class="links" href="/live/">Життя</a></b></td>
</tr>
</DIV>
<DIV id="List01" class="close">

<tr>
<td class="links" colspan="2" background="/templates/vechorka/images/bgs_3.gif" height="20"><img src="/templates/vechorka/images/arr_4.gif" style="margin-left: 7px; margin-right: 21px;" alt="" height="5" width="5"><b><a class="links" href="/live/">Життя</a></b></td>
</tr>
<tr>
<td class="links" colspan="2" background="/templates/vechorka/images/bgs_5.gif" height="20"><img src="/templates/vechorka/images/arr_4.gif" style="margin-left: 7px; margin-right: 21px;" alt="" height="5" width="5"><a href="/live/society/" class="links">Суспільство</a></td>
</tr>
<tr>
<td class="links" colspan="2" background="/templates/vechorka/images/bgs_5.gif" height="20"><img src="/templates/vechorka/images/arr_4.gif" style="margin-left: 7px; margin-right: 21px;" alt="" height="5" width="5"><a href="/live/security/" class="links">Безпека</a></td>
</tr>
<tr>
<td class="links" colspan="2" background="/templates/vechorka/images/bgs_5.gif" height="20"><img src="/templates/vechorka/images/arr_4.gif" style="margin-left: 7px; margin-right: 21px;" alt="" height="5" width="5"><a href="/live/education/" class="links">Освіта</a></td>
</tr>
<tr>
<td class="links" colspan="2" background="/templates/vechorka/images/bgs_5.gif" height="20"><img src="/templates/vechorka/images/arr_4.gif" style="margin-left: 7px; margin-right: 21px;" alt="" height="5" width="5"><a href="/live/interview/" class="links">Інтерв’ю</a></td>
</tr>
<tr>
<td class="links" colspan="2" background="/templates/vechorka/images/bgs_5.gif" height="20"><img src="/templates/vechorka/images/arr_4.gif" style="margin-left: 7px; margin-right: 21px;" alt="" height="5" width="5"><a href="/live/livenews/" class="links">Життя</a></td>
</tr>
<tr>
<td class="links" colspan="2" background="/templates/vechorka/images/bgs_5.gif" height="20"><img src="/templates/vechorka/images/arr_4.gif" style="margin-left: 7px; margin-right: 21px;" alt="" height="5" width="5"><a href="/live/two/" class="links">Двоє</a></td>
</tr>
<tr>
<td class="links" colspan="2" background="/templates/vechorka/images/bgs_5.gif" height="20"><img src="/templates/vechorka/images/arr_4.gif" style="margin-left: 7px; margin-right: 21px;" alt="" height="5" width="5"><a href="/live/animals/" class="links">Тварини</a></td>
</tr>

</DIV>
</table>
Он отображает полную таблицу а хотелось-бы чтоб прятал как с бр..
помогите новчику
h0ttab вне форума  
Старый 09.09.2007, 07:41     # 14
Hubbitus
мод
IMHO Кодер-200(6,7,8)
 
Регистрация: 29.03.2003
Адрес: Saint-Petersburg, Russia
Пол: Male
Сообщения: 2 734

Hubbitus Бог с наворотамиHubbitus Бог с наворотами
Hubbitus Бог с наворотамиHubbitus Бог с наворотамиHubbitus Бог с наворотамиHubbitus Бог с наворотамиHubbitus Бог с наворотамиHubbitus Бог с наворотамиHubbitus Бог с наворотамиHubbitus Бог с наворотамиHubbitus Бог с наворотамиHubbitus Бог с наворотамиHubbitus Бог с наворотамиHubbitus Бог с наворотами
h0ttab, да где же Вы читали про HTML, чтобы у таблицы были внутри div-элементы???

Ну а в остальном также сделать как и в примере выше.

Код HTML:
<html>
<style type="text/css">
.list	{width: 130px; height: 14px;}
.close	{width: 130px; height: 1px; overflow: hidden;}
.open	{width: 130px; height: auto; overflow: visible;}
</style>

<script language="JavaScript">
var Lists = new Array;
Lists[0] = "List01";
function ListOnClick(ListID){
var d = document.getElementById(ListID);
d.className = (d.className == "open")?"close":"open";
	for(i = 0; i < Lists.length; i++){
	d1 = document.getElementById(Lists[i]);
		if(d1.id != d.id) d1.className = "close";
	}
}
</script>

<body>

<table>
<thead class="list" onClick="ListOnClick('List01')">
	<tr>
	<td class="links" background="/templates/vechorka/images/bgs_3.gif" height="20"><img src="/templates/vechorka/images/arr_4.gif" style="margin-left: 7px; margin-right: 21px;" alt="" height="5" width="5"><b><a class="links" href="#">Життя</a></b></td>
	</tr>
</thead>

<tbody id="List01" class="close">
	<tr>
		<td class="links" background="/templates/vechorka/images/bgs_3.gif" height="20"><img src="/templates/vechorka/images/arr_4.gif" style="margin-left: 7px; margin-right: 21px;" alt="" height="5" width="5"><b><a class="links" href="/live/">Життя</a></b></td>
	</tr>
	<tr>
		<td class="links" background="/templates/vechorka/images/bgs_5.gif" height="20"><img src="/templates/vechorka/images/arr_4.gif" style="margin-left: 7px; margin-right: 21px;" alt="" height="5" width="5"><a href="/live/society/" class="links">Суспільство</a></td>
	</tr>
	<tr>
		<td class="links" background="/templates/vechorka/images/bgs_5.gif" height="20"><img src="/templates/vechorka/images/arr_4.gif" style="margin-left: 7px; margin-right: 21px;" alt="" height="5" width="5"><a href="/live/security/" class="links">Безпека</a></td>
	</tr>
	<tr>
		<td class="links" background="/templates/vechorka/images/bgs_5.gif" height="20"><img src="/templates/vechorka/images/arr_4.gif" style="margin-left: 7px; margin-right: 21px;" alt="" height="5" width="5"><a href="/live/education/" class="links">Освіта</a></td>
	</tr>
	<tr>
		<td class="links" background="/templates/vechorka/images/bgs_5.gif" height="20"><img src="/templates/vechorka/images/arr_4.gif" style="margin-left: 7px; margin-right: 21px;" alt="" height="5" width="5"><a href="/live/interview/" class="links">Інтерв’ю</a></td>
	</tr>
	<tr>
		<td class="links" background="/templates/vechorka/images/bgs_5.gif" height="20"><img src="/templates/vechorka/images/arr_4.gif" style="margin-left: 7px; margin-right: 21px;" alt="" height="5" width="5"><a href="/live/livenews/" class="links">Життя</a></td>
	</tr>
	<tr>
		<td class="links" background="/templates/vechorka/images/bgs_5.gif" height="20"><img src="/templates/vechorka/images/arr_4.gif" style="margin-left: 7px; margin-right: 21px;" alt="" height="5" width="5"><a href="/live/two/" class="links">Двоє</a></td>
	</tr>
	<tr>
		<td class="links" background="/templates/vechorka/images/bgs_5.gif" height="20"><img src="/templates/vechorka/images/arr_4.gif" style="margin-left: 7px; margin-right: 21px;" alt="" height="5" width="5"><a href="/live/animals/" class="links">Тварини</a></td>
	</tr>
</tbody>
</table>

</body>
</html>
__________________
Я делаю Линукс! Присоединяйтесь к свободным людям!

Связаться со мной всегда можно по джабберу: Hubbitus@jabber.ru
Pahan-Hubbitus.
Hubbitus вне форума  
Старый 10.09.2007, 07:28     # 15
shuron
Full Member
 
Аватар для shuron
 
Регистрация: 16.09.2003
Сообщения: 793

shuron Луч света в тёмном царствеshuron Луч света в тёмном царствеshuron Луч света в тёмном царствеshuron Луч света в тёмном царствеshuron Луч света в тёмном царстве
P.S. javaScript!!! a ne java...
shuron вне форума  

Опции темы

Ваши права в разделе
Вы НЕ можете создавать новые темы
Вы не можете отвечать в темах.
Вы НЕ можете прикреплять вложения
Вы НЕ можете редактировать свои сообщения

BB код Вкл.
Смайлы Вкл.
[IMG] код Выкл.
HTML код Выкл.

Быстрый переход


Часовой пояс GMT +4, время: 00:15.




Powered by vBulletin® Version 3.8.5
Copyright ©2000 - 2026, Jelsoft Enterprises Ltd.