|
|
|
| Вот, модифицируйте и пользуйтесь. Собственно, прелесть скрипта в том, что в тэги не нужно прописывать события onClick - их перехватывает функция.
<html>
<head>
<style>
.header { border-bottom: 1px dashed black; cursor: pointer; cursor: hand; }
#d2, #d3 { padding-top: 20px; }
.menu { width: 300px; height: 150px; background-color: black; color: white; display: none; }
.visible { display: block; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready( function() {
$('span.header').click( function() {
var parentID = $(this).parents('div').attr('id');
$("#" + parentID + " > .menu").slideToggle( 'fast' );
});
return false;
});
</script>
</head>
<div id="d1">
<span class="header">Новые идеи и новые решения</span>
<div class="menu visible">
Тут будет текст на чорном <br/>
</div>
</div>
<div id="d2">
<span class="header">Старые идеи и старые решения</span>
<div class="menu">
По-моему, отлично работает :)
</div>
</div>
<div id="d3">
<span class="header">И еще третий пункт меню</span>
<div class="menu">
Превеееееед :)
</div>
</div>
</html>
|
| |
|
|
|
|
|
|
|
для: aexb
(17.04.2008 в 10:04)
| | А как следует переписать код чтобы вначале всё было свернуто ? | |
|
|
|
|
|
|
|
для: aexb
(17.04.2008 в 10:04)
| | >aexb
<script>
$(document).ready( function() {
$('span.header').click( function() {
$(this).next().slideToggle( 'fast' );
});
return false;
});
</script>
|
>Antohins
<div class="menu visible"> замени на <div class="menu"> | |
|
|
|
|
|
|
|
для: AlexSol
(17.04.2008 в 10:50)
| | а как сделать чтобы высота блока выбиралась автоматом? Т.е. чтобы она зависела от количества инфы в этом блоке | |
|
|
|
|
|
|
|
для: Antohins
(17.04.2008 в 15:56)
| |
.menu { width: 300px; height: 150px; background-color: black; color: white; display: none; }
|
Сотри высоту
.menu { width: 300px; background-color: black; color: white; display: none; }
|
| |
|
|
|
|
|
|
|
для: Ninjak
(17.04.2008 в 16:27)
| | спасибончес | |
|
|
|
|
|
|
|
для: AlexSol
(17.04.2008 в 10:50)
| | вооооот, воооот то, что я так долго искал :) спасибо!
upd.: но если, например, перед блоком "menu" будет нужен еще один элемент, то next() будет ссылаться уже на него, а не на "menu". но в данном случае именно так и нужно :) | |
|
|
|
|
|
|
|
для: aexb
(21.04.2008 в 09:32)
| | два next() :) но уж точно не через id.
смотрите http://visualjquery.com/1.1.2.html >DOM >Traversing | |
|
|
|
|
|
|
|
для: aexb
(17.04.2008 в 10:04)
| | А можно ли сделать, чтобы после разворачивания пункта меню оно отановалось развернутым и после перехода на другую страницу и после обновления страницы, а по клику на пункт сворачивалось ? | |
|
|
|
|
|
|
|
для: Rasher
(31.07.2008 в 02:39)
| | Можно, записывайте состояние меню в cookie. | |
|
|
|
|
|
|
|
для: sim5
(31.07.2008 в 06:12)
| | Как это сделать ? | |
|
|
|
|
|
|
|
для: Rasher
(31.07.2008 в 13:59)
| | Доработать скрипт. Он должен проверять, установлена ли cookie. Если да, то ситать из нее (как я полагаю) раскрытый объект (ветвь мен.). При каждом раскрыти ветви меню, записывать cookie. | |
|
|
|
|
|
|
|
для: Rasher
(31.07.2008 в 13:59)
| | Соседнюю тему ещё посмотрите. Может и без куков обойдётся.
http://www.softtime.ru/forum/read.php?id_forum=4&id_theme=56184&page=1 | |
|
|
|
|
|
|
|
для: Axxil
(31.07.2008 в 16:58)
| | По идее, должно работать и в CHM файлах, в отличие от куков. | |
|
|
|
|
|
|
|
для: sim5
(31.07.2008 в 17:51)
| | А если открыть один список, как сделать чтоб все остальные открытые закрылись?! | |
|
|
|
|
|
|
|
для: aexb
(17.04.2008 в 10:04)
| | Может кто-нибудь знает для чего нужна строчка: <script src="http://code.jquery.com/jquery-latest.js"></script>?
И можно ли без ее обойтись? | |
|
|
|
|
|
|
|
для: shah
(05.10.2008 в 23:01)
| | омг скачай то шо по ссылке и подключай сам скрипт. | |
|
|
|