Форум hotibo.ru

AKS · 04.07.2010 11:00

Обсуждение темы Компактный список.
Любые замечания и вопросы можно (и нужно) высказывать здесь...

mdi · 19.07.2010 14:23

Когда запустил исправленный список в IE5 и FF, то получил всего одну иконку "плюс" справа от "пункт 1" ...??? Все остальное осталось без изменений: список как был открывшимся, так и остался ....

Konstantin · 21.08.2010 15:27

Отличная работа! У меня есть несколько соображений по поводу наворотить скрипт:) В код я не смотрел...

1. Интересной возможностью была бы опция - приоткритая ветвь.. То есть, если указать одну или несколько ветвей то они будут отображаться открытыми (в нынешнем варианте по умолчанию список представлен только родительскими элементами).

1.1 Если пойти дальше то можно добавить еще и опцию - приоткрытая ветвь должна отобразится с всеми имеющимися детками, либо должны появится детки +1 level-a...

2. По умолчанию вся иерархия элементов открыта (сейчас наооборот все элементы кроме основных родительских спрятанный)

3. Открыть/закрыть все элементы ( функции-методы позволяющие открыть-закрыть все древо)

4. При открытии одной ветки если имелась другая приоткрытая ветка - закрывать ее (это относится только к главным элементам иерархии), данная возможность опциональна, ее можно использовать, а можно и нет.

5. Сделать удобную систему скинов для меню которая позволит менять внешний вид меню (это как я понимаю сделать будет легко так как мы имеем простои список)

Отредактированно Konstantin (21.08.2010 15:42)

AKS · #4 21.08.2010 16:43

Konstantin
Интересные предложения. Если у Вас есть время реализовать эти замыслы, то готов дополнить уже имеющееся описание сценария, если возникнут вопросы. Хотя, как Вы заметили, это простой список, и в работе с ним не должно возникнуть трудностей...

robert · 17.09.2010 01:36

Если не очень трудно, подскажите как перенести изображения "плюсы", "минусы" не в конец строчки, а в начало?

Еще вопрос - где (попроще) почитать о работе с DOM и javascript? Алгоритм вроде понятен, но не понятно как описАть служебными функциями (методами).. Еще бы на русском языке

И ещё - как лучше отлаживать такие скрипты??

Отредактированно robert (17.09.2010 01:50)

AKS · #6 17.09.2010 09:42

robert
В начало перенести "плюсы" можно так - в объекте createCompactList.prototype.expandUtil в методе setOpeners заменить в строке:

Код:

aListItems[i].insertBefore(this.openers[k], oList);

oList на aListItems[i].getElementsByTagName("a")[0].
Но тут возникнет небольшая проблема (увидите сами). Именно поэтому я не стал связываться с дополнительным форматированием, а сделал так, как есть. Пусть может быть не стандартно, но почему должно быть обязательно, как у всех?..

где (попроще) почитать о работе с DOM и javascript?

На мой взгляд информации полно, даже не знаю, что тут посоветовать (разве что воспользоваться любым удобным поисковиком).
А насчет отладки - это смотря что отлаживать...

AKS · #7 17.09.2010 10:38

Вот так будет проще:

Код:

aListItems[i].insertBefore(this.openers[k], aListItems[i].firstChild);

robert · #8 17.09.2010 12:27

Я воспользовался поисковиком

Нашел сайт dhtml.ru - есть справочник DOM на русском

Document Object Model (DOM) Level 2 Core Specification
http://w3.org/TR/2000/REC-DOM-Level … -20001113/

JavaTM 2 Platform, Standard Edition, v 1.4.2
API Specification
http://java.sun.com/j2se/1.4.2/docs/api … mmary.html

Но это всё справочники. каких-то реальных советов с конкретными примерами почти нет.

Возможно, есть книги, где более понятно описаны функции (с примерами) - поищу..

Самое полезное было почитать раздел DOM на этом сайте

Спасибо за ответ - буду разбираться.

mmp · 10.01.2011 08:43

mmproject, так давайте в форуме (выше есть ссылка) взглянем на “скрипт - одна строчка”.

примерно так:

Код:

something1
something2
something3
something4sublist
- something41
- something42
- something43
- something44
something5
something6

runcore · 10.01.2011 20:58

Здравствуйте.
Начал использовать ваш список в реальном проекте, и столкнулся с рядом проблем, которые не смог решить самостоятельно пока. ) например:
1) если углубиться в меню и потом нажать на ссылку. то страница перегружается и список отображается опять свернутым, ну оно и понятно. Вопрос. как бы его опять раскрыть. Пытался эмулировать клики соответствующие клики на списке, чтобы он опять автоматом раскрылся но не получилось. вызывал функцию onClick(), но не понял что туда передавать. ведь идентификаторы для LI и UL там нигде не фигурируют.
2) еще заметил что при переходе по страницам список сначала показывается развернутым (не обработанным еще), а потом уже при OnLoad страницы срабатывает функция которая приводит его рабочее состояние. некрасиво. но это победилось тем что вызов обработчика списка делаю сразу после того как он сгенерировался. не жду пока загрузится вся страница. )

В общем меня интересует ответ первому пункту. может подкините идею, как это можно реализовать.
спасибо.

AKS · #11 10.01.2011 22:44

mmp
Вы что, издеваетесь? Это тот же функционал, что и в обсуждаемом примере? Я столько времени потратил, чтобы разобраться, как сделать появление каждого пункта скрытого списка поочередно, а Вы тут "display = 'none' || 'block'. Да-а-а...
runcore
Я ведь там не случайно написал, что "сценарий написан в академических целях". Т.е. для использования требуется серьезная доработка.
По 2-у вопросу могу сразу сказать - для того, чтобы список был изначально "свернутым", в стилях укажите:

Код:

 .menu ul li ul li {
    display:none;
}

По первому вопросу - сложнее. С данным сценарием пока не знаю, а вообще делал следующим образом. Среди всех ссылок списка ищется та, чей адрес совпадает с адресом текущей страницы. Далее ищется родительский элемент списка, в котором она находится, и на элементе, отвечающем за открытие этой "ветки" эмулируется клик путем создания пользовательского объекта Event и методов fireEvent/dispatchEvent.

mmp · #12 11.01.2011 08:58

Я же написал ПРИМЕРНО ТАК!
Я времени много не тратил, написал сходу.
Но если Вы так реагируете, пожалуйста, вот:

Код:

something1
something2
something3
something4sublist
- something41
- something42
- something43
something5

писал минут 20.
Ваш скрипт, конечно, хорош, но только в академических целях -
неоправданно сложно (мое личное мнение).

mmp · #13 11.01.2011 09:44

runcore
соображения по пункту 1)

"Пытался эмулировать клики.. - зачем так сложно то???

"Среди всех ссылок списка ищется та, чей адрес совпадает с адресом текущей страницы..."
тогда открытым будет только подменю этой страницы, а если до перехода были раскрыты и другие?

мое мнение:
нужно добавить глобальную переменную (массив || строку), в которую при раскрытии
каждого подменю дописывать этот факт (при закрытии, соответственно, убирать),
а при переходе по ссылке добавлять эту переменную в url
и при загрузке следующей страницы открывать нужные подменюхи

Отредактированно mmp (11.01.2011 09:50)

AKS · 11.01.2011 17:10

mmp

Я же написал ПРИМЕРНО ТАК!

Нет, сначала была реплика: "весь скрипт - одна строчка".

если Вы так реагируете

А что, адекватная реакция. То, что все можно "уместить" в одну строчку - это ведь неправда, Вы это сами доказали...

mmp · #15 11.01.2011 19:54

В первом варианте скрипт действительно был "одна строчка":

Код:

 document.getElementById('s4').style.display=(document.getElementById('s4').style.display=='none')?'block':'none'

остальное html, не правда ли?
Вообще замечание не по существу. Придираетесь к словам хотя сами не очень-то логичны:

"Это тот же функционал, что и в обсуждаемом примере? Я столько времени потратил, чтобы разобраться, как сделать появление каждого пункта скрытого списка поочередно..."

По Вашему поочередное появление пунктов списка - это ФУНКЦИОНАЛ? Мне кажется, что это оформление.
А по функционалу мой "однострочный" скрипт ничем не уступает Вашему "академическому". А уж насколько проще!

И все-таки я бы хотел услышать Ваше мнение по поводу второго варианта, согласитесь, он в сто раз проще,
да и пункты поочередно появляются.

AKS · #16 11.01.2011 20:37

Я вообще не пойму - Вам от меня чего нужно? Хотите - считайте, что "весь скрипт - одна строчка", но не требуйте от меня какого-то согласия...

guvatara · 11.10.2011 17:07

Вопросец такой. Что нужно добавить к скрипту, чтоб список раскрывался не только нажатием на плюсик, но и на ссылку списка, при этом соответсвенно менялся плюсик на минусик

mmp написал:

Я же написал ПРИМЕРНО ТАК!
Я времени много не тратил, написал сходу.
писал минут 20.
Ваш скрипт, конечно, хорош, но только в академических целях -
неоправданно сложно (мое личное мнение).

Ну относительно вашего скрипта могу сказать одно. Есть пользователи которые отключают исполнение жаба скриптов и тогда им будет не доступно содержание вложенного меню. Так что тот академический куда более универсальный, чем ваш.

Отредактированно guvatara (11.10.2011 17:28)

AKS · 13.10.2011 21:14

guvatara написал:

Вопросец такой. Что нужно добавить к скрипту, чтоб список раскрывался не только нажатием на плюсик, но и на ссылку списка, при этом соответсвенно менялся плюсик на минусик

Это сделать довольно просто. В функции listInitializer найдите строку:

Код:

                    this.addHandler(openerNode, 'click',
                               newObj.onClickHandler
                                     .adapt(newObj, true));

, скопируйте ее, вставьте копию следом за ней и заментте openerNode на currItem.firstChild. В результате должно получиться:

Код:

                    this.addHandler(openerNode, 'click',
                               newObj.onClickHandler
                                     .adapt(newObj, true));
                    this.addHandler(currItem.firstChild, 'click',
                               newObj.onClickHandler
                                     .adapt(newObj, true));

Вот так должно получиться то, что Вам нужно.

DuC · 22.02.2012 15:03

Я же написал ПРИМЕРНО ТАК!
Я времени много не тратил, написал сходу.
Но если Вы так реагируете, пожалуйста, вот:
Код:
Код:
    
something1

something2

something3

something4sublist

something41

something42

something43

something5
писал минут 20.
Ваш скрипт, конечно, хорош, но только в академических целях -
неоправданно сложно (мое личное мнение).

а как в этои коде сделать так чтобы были картинки +/-?

Форум hotibo.ru

#1 04.07.2010 11:00

Компактный список.

#2 19.07.2010 14:23

Re: Компактный список.

#3 21.08.2010 15:27

Re: Компактный список.

#4 21.08.2010 16:43

Re: Компактный список.

#5 17.09.2010 01:36

Re: Компактный список.

#6 17.09.2010 09:42

Re: Компактный список.

Код:

#7 17.09.2010 10:38

Re: Компактный список.

Код:

#8 17.09.2010 12:27

Re: Компактный список.

#9 10.01.2011 08:43

Re: Компактный список.

Код:

#10 10.01.2011 20:58

Re: Компактный список.

#11 10.01.2011 22:44

Re: Компактный список.

Код:

#12 11.01.2011 08:58

Re: Компактный список.

Код:

#13 11.01.2011 09:44

Re: Компактный список.

#14 11.01.2011 17:10

Re: Компактный список.

#15 11.01.2011 19:54

Re: Компактный список.

Код:

#16 11.01.2011 20:37

Re: Компактный список.

#17 11.10.2011 17:07

Re: Компактный список.

mmp написал:

#18 13.10.2011 21:14

Re: Компактный список.

guvatara написал:

Код:

Код:

#19 22.02.2012 15:03

Re: Компактный список.

Код:

Board footer