Раскрывающийся список в HTML - HTML и CSS

BastAngel · 11.09.2011, 13:53

Подскажите пожалуйста как создать список в HTML что бы при нажатии допустим на "Жанр" список раскрывался и появлялись дополнительные пункты как "Научная фантастика", "Юмористическая фантастика", "Фентези" и т.д.

lux16 · 11.09.2011, 14:10

Используй select
<select>
<option>Пункт 1</option>
<option>Пункт 2</option>
</select>

BastAngel · 11.09.2011, 14:22

Цитата:

Сообщение от lux16

Используй select
<select>
<option>Пункт 1</option>
<option>Пункт 2</option>
</select>

Это получается обычный выпадающий список... А надо что бы выглядело как-то так..

Жанр
------Фентези
------научная фантастика
------юмористическая фантастика.

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

lux16 · 11.09.2011, 14:23

Я не понимаю, что ты именно хочешь. Ты хотел список, вот тебе список. Остальное лишь твоя фантазия, или flash или jQuery или чистый JS

ZvEr_HaCkEr · 11.09.2011, 15:47

Вам надо как здесь?

BastAngel · 11.09.2011, 16:06

Цитата:

Сообщение от ZvEr_HaCkEr

Вам надо как здесь?

Да) Как разделы "Категория", "Навигация" и "Инструменты"

ZvEr_HaCkEr · 11.09.2011, 16:20

Код:

<!DOCTYPE html>
<html>
<head>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
    <style>
h3 { cursor:pointer;}
</style>
</head>
<body>
<div class="box">
    <h3><span>Список №1+</span></h3>
    <ul>
        <li>Пункт №1</li>
        <li>Пункт №2</li>
        <li>Пункт №3</li>
        <li>Пункт №4</li>
    </ul>
</div>
<div class="box">
    <h3><span>Список №2+</span></h3>
    <ul>
        <li>Пункт №5</li>
        <li>Пункт №6</li>
        <li>Пункт №7</li>
        <li>Пункт №8</li>
    </ul>
</div>
<script>
$(document).ready(function(){
$("ul").hide();
$("h3 span").click(function(){
$(this).parent().next().slideToggle();
});
}); 
</script>
</body>
</html>

BastAngel · 11.09.2011, 18:58

Спасибо большое)

Lesha · 11.09.2011, 19:26

еще можете взглянуть на CSS реализацию

http://cssor.ru/css/polezno-interesnoe/cssmenu

BastAngel · 11.09.2011, 19:55

Спасибо всем за помощь_))

11.09.2011, 13:53	#1
BastAngel Пользователь Регистрация: 02.06.2010 Сообщений: 53	Раскрывающийся список в HTML Подскажите пожалуйста как создать список в HTML что бы при нажатии допустим на "Жанр" список раскрывался и появлялись дополнительные пункты как "Научная фантастика", "Юмористическая фантастика", "Фентези" и т.д.

11.09.2011, 14:10	#2
lux16 Форумчанин Регистрация: 11.02.2009 Сообщений: 305	Используй select <select> <option>Пункт 1</option> <option>Пункт 2</option> </select> Хочу быть лучшим, но пока что я только обычный =(

11.09.2011, 14:23	#4
lux16 Форумчанин Регистрация: 11.02.2009 Сообщений: 305	Я не понимаю, что ты именно хочешь. Ты хотел список, вот тебе список. Остальное лишь твоя фантазия, или flash или jQuery или чистый JS Хочу быть лучшим, но пока что я только обычный =(

Опции темы	Поиск в этой теме
Версия для печати Отправить по электронной почте	Поиск в этой теме: Расширенный поиск

Похожие темы
Тема	Автор	Раздел	Ответов	Последнее сообщение
Раскрывающийся список	dacorp	JavaScript, Ajax	0	05.09.2011 15:05
Раскрывающийся список	Linochka	Компоненты Delphi	0	16.05.2011 10:01
Раскрывающийся список	mephist	Microsoft Office Excel	2	02.02.2010 10:33
Раскрывающийся список.	gusluk	Компоненты Delphi	3	27.11.2009 10:54
Раскрывающийся список	segail	Microsoft Office Excel	22	19.07.2009 19:34

11.09.2011, 15:47	#5
ZvEr_HaCkEr VisualC++/DirectX Форумчанин Регистрация: 16.07.2010 Сообщений: 831	Вам надо как здесь?

11.09.2011, 18:58	#8
BastAngel Пользователь Регистрация: 02.06.2010 Сообщений: 53	Спасибо большое)

11.09.2011, 19:26	#9
Lesha Форумчанин Регистрация: 30.01.2009 Сообщений: 418	еще можете взглянуть на CSS реализацию http://cssor.ru/css/polezno-interesnoe/cssmenu

11.09.2011, 19:55	#10
BastAngel Пользователь Регистрация: 02.06.2010 Сообщений: 53	Спасибо всем за помощь_))