Вернуться   Дизайнерский форум » ВЕБ-ПРОГРАММИРОВАНИЕ » HTML, CSS, JavaScript

как свернуть дерево??

Обсуждение темы как свернуть дерево?? в разделе HTML, CSS, JavaScript, часть категории ВЕБ-ПРОГРАММИРОВАНИЕ; Помогите плиз, через 5 дней диплом защищать, а у меня не готово!! Есть код дерева(скачал из инета): Цитата: <style type="text/css"> .treeview { padding: ...


Закрытая тема
 
Опции темы
Старый 12.06.2011, 16:54   #1
Помогите плиз, через 5 дней диплом защищать, а у меня не готово!!
Есть код дерева(скачал из инета):

Цитата:
<style type="text/css">
.treeview { padding: 0; clear: both; font-family: Arial, sans-serif; width: 100%; }
.treeview * { font-size: 100.1%; }
.treeview ul
{
overflow: hidden; width: 100%; margin: 0; padding: 0 0 1.5em 0;
list-style-type: none;
}
.treeview ul ul { overflow: visible; width: auto; margin: 0 0 0 0; padding: 0 0 0 0.75em; }
/* класс для ul после которых нет li в родительских ветках */
.treeview ul.l { border-left: 1px solid; margin-left: -1px; }
.treeview li.cl ul { display: none; }
.treeview li { margin: 0; padding: 0; }
.treeview li li { margin: 0 0 0 0.5em; border-left: 1px dotted; padding: 0; }
.treeview li div { position: relative; height: 1.5em; min-height: 16px; //height: 1.3em; }
.treeview li li div { border-bottom: 1px dotted; }
.treeview li p
{
position: absolute; z-index: 1; top: 0.8em; //top: 0.65em; left: 1.75em;
width: 100%; margin: 0; border-bottom: 1px dashed; padding: 0;
}
.treeview a { padding: 0.1em 0.2em; white-space: nowrap; //height: 1px; }
.treeview img.i
{
border-right: 2px solid; border-bottom: 0.5em solid;
margin-bottom: -0.5em; vertical-align: middle;
}
.treeview a.sc
{
position: absolute; top: 0.06em;
margin-left: -1em; padding: 0; text-decoration: none;
}

/* colors */
.treeview li p,
.treeview img.i,
.treeview .sc
{ background: #f5f5ea; }
.treeview ul.l,
.treeview li p,
.treeview img.i
{ border-color: #f5f5ea; }
.treeview ul li li,
.treeview ul li li div
{ border-color: #999999; }
.treeview a,
.treeview a.sc,
.treeview a.sc:hover
{ color: #000000; }
.treeview a:hover
{ color: #cc0000; }
</style>
<script type="text/javascript">
function UnHide( eThis ){
if( eThis.innerHTML.charCodeAt(0) == 9658 ){
eThis.innerHTML = '▼'
eThis.parentNode.parentNode.parentNode.className = '';
}else{
eThis.innerHTML = '►'
eThis.parentNode.parentNode.parentNode.className = 'cl';
}
return false;
}
</script>
всё норм, тока дерево изначально полностью развёрнуто, а мне надо наоборот. Смотрел в интернете, спрашивал у друзей-никто не знает.
Помогите!! Очень надо.
заранее спасибо.
 
Старый 12.06.2011, 16:54
Ссылки
Старый 12.06.2011, 21:17   #2
Цитата:
function UnHide
что за функция? по-логике она разворачивает дерево изначально.
меняем на Hide и смотрим, что получилось
 
Старый 13.06.2011, 14:33   #3
не, я тут всё пробовал-ничего не выходит(((
а когда я пишу "function Hide" дерево вообще перестают сворачиваться даже по клику мыши.
Может надо что нибудь дописать??

Добавлено через 49 минут

нашёл в интернете это:
но сам не разобрался. Помогите)
Цитата:
Для скрытия-раскрытия добавим два CSS-правила.
показать чистый исходник в новом окне Скрыть/показать номера строк печать кода с сохранением подсветки
.ExpandOpen .Container {
display: block;
}
.ExpandClosed .Container {
display: none;
}

Как всегда, важен порядок. ExpandClosed идет после ExpandOpen, поэтому имеет больший приоритет, и вложенные закрытые узлы отображаются закрытыми.

Для скрытия-раскрытия javascript-функция всего лишь меняет класс узла. Остальное делает CSS.

Чтобы в дереве поддерживалось скрытие-раскрытие - достаточно повесить обработчик на самый внешний div.

Последний раз редактировалось додди; 13.06.2011 в 14:33.. Причина: Добавлено сообщение
 
Старый 13.06.2011, 14:33
Закрытая тема




Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Функция Свернуть/развернуть tigerosik Вопросы по SEO 0 20.09.2014 21:13
Родословное дерево ddddd Кальянная 3 10.10.2009 09:16
Подскажите как нарисовать дерево (с листьями) dania Растровая графика 3 17.04.2008 10:53
Универсальное Nn, Ie Js-дерево без обновлений. Кто-то занимался? Romis ASP, Perl, PHP и MySQL 1 03.03.2005 12:41


Текущее время: 19:33. Часовой пояс GMT +4.

Реклама на форуме Условия размещения рекламы
Биржа ссылок Заработай на сайте!
Дизайнерский форум