Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   jQuery jTreeMenu plugin (https://javascript.ru/forum/jquery/7032-jquery-jtreemenu-plugin.html)

Seafnox 11.01.2010 22:30

jQuery jTreeMenu plugin
 
Итак пару недель назад начал искать плагин для создания древовидного меню на jQuery и столкнулся с возмутившими меня обстоятельствами.. рекомендованный JQuery.MenuTree.js начал выделывать удивительные трюфеля в фф3 и ие6 уже на меню с двумя одноуровневыми подменю, но их идея мне понравилась и я рискнул написать собственный плагин, который БУДЕТ работать везде..
назвал я его
jTreeMenu.js
а вот собственно и сам код
if (jQuery) (function($) {

   $.extend($.fn, {
treeMenu: function(o) {
$(this).find('ul').css({'list-style' : 'none'});
$(this).find('li.parent ul').slideUp(500);
$(this).find('li.parent').removeClass('collapse').removeClass('expand').addClass('collapse').bind("click", sliding);
function sliding()
{
if ($(this).hasClass('collapse'))
{
var obj = $(this).parent();
obj.find('li.parent').removeClass('expand').removeClass('collapse').addClass('collapse');
obj.find('li.parent ul').slideUp(500);
$(this).addClass('expand').removeClass('collapse');
$(this).children('ul').slideDown(500);

}
else
{
$(this).addClass('collapse').removeClass('expand');
$(this).children('ul').slideUp(500);
}
return false;
}
       }
   });

})(jQuery);

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

сейчас плагин работает в совершенстве всегда только на опере в ие даже 8 версии на двухуровневом меню начинаються танцы с бубном, фф не проверял...

начнем?

ЗЫ если кто то уже сделал такой плагин, либо отыскал в просторах кроссбраузерно рабочий плагин, поддерживающий все ие, оперу, фф и прочее(главное чтобы на jQuery), то поделитесь ссылкой... ато может изобретать велосипед не стоит...:thanks:

<div id="vsl_menu">
<ul>
<li class="parent"><a href="#">Первое подменю</a>
<ul>
<li class="child">Массаж лица</li>
<li class="child">Мезотерапия</li>
<li class="child">Электрофорез</li>
<li class="child">Визаж</li>
</ul>
</li>
<li class="child">меню 1</li>
<li class="child">меню 2</li>
<li class="child">меню 3</li>
<li class="parent"><a href="#">Второе подменю</a>
<ul>
<li class="child">Обертывание</li>
<li class="child">Ручная методика</li>
<li class="child">Аппаратная метдика</li>
</ul>
</li>
<li class="child">меню 1</li>
<li class="child">меню 1</li>
<li class="child">меню 1</li>
<li class="child">меню 1</li>
<li class="child">меню 1</li>
</ul>
</div>


проверить работу можно на этом меню
не забываем подключать сам jQuery
для активации на реади ставим:

$('#vsl_menu').treeMenu();

PeaceCoder 11.01.2010 23:15

ОФФТОП:
О боже как страшно елы палы.
if (jQuery) (function($) {
 
   $.extend($.fn, {
treeMenu: function(o) {
$(this).find('ul').css({'list-style' : 'none'});
$(this).find('li.parent ul').slideUp(500);
$(this).find('li.parent').removeClass('collapse').removeClass('expand').addClass('collapse').bind("click", sliding);
function sliding()
{
if ($(this).hasClass('collapse'))
{
var obj = $(this).parent();
obj.find('li.parent').removeClass('expand').removeClass('collapse').addClass('collapse');
obj.find('li.parent ul').slideUp(500);
$(this).addClass('expand').removeClass('collapse');
$(this).children('ul').slideDown(500);
 
}
else
{
$(this).addClass('collapse').removeClass('expand');
$(this).children('ul').slideUp(500);
}
return false;
}
       }
   });
 
})(jQuery);


вы хоть о производительности думаете хоть когда нибудь? куча туча новых обьектов создаете из одного и тогоже... с одним работать слабо? ах да. я забыл что jQ не умеет сохранять себя же в кеше...

Octane 11.01.2010 23:51

Цитата:

Сообщение от PeaceCoder
ах да. я забыл что jQ не умеет сохранять себя же в кеше...

Селекторы не кэшируются, но запомнить ссылку на jQuery-объект с коллекцией ничто не мешает.

PeaceCoder 12.01.2010 00:11

ОФФТОП:
Цитата:

Сообщение от Octane
Селекторы не кэшируются, но запомнить ссылку на jQuery-объект с коллекцией ничто не мешает.

в этом то и проблема. надо создавать новый обьект, что бы продолжать юзать текущий. т.к. изначально не продумана механика jQuery. ведь если коллекцию изменить, ссылка будет не действительной сохранению :Р к тому же надо прервать цепочку что оч неудобно.

Octane 12.01.2010 00:14

бред

PeaceCoder 12.01.2010 00:52

ОФФТОП:
это не бред. поробуй сделать коллекцию сохранить на нее ссылку. потом например использовать функцию find. а потом например использовать записанную ссылку с якобы сохраненными элементами... что ты получишь? не ту ли коллекцию которую получил после операции find ? а что бы такого небыло надо клонировать коллекцию... а это время... создавать новую коллекцию тоже время... что к стати выше тратится в пустую.

Octane 12.01.2010 01:02

попробуй, прежде чем писать

micscr 12.01.2010 08:43

Цитата:

Сообщение от PeaceCoder (Сообщение 40267)
ОФФТОП:
это не бред. поробуй сделать коллекцию сохранить на нее ссылку. потом например использовать функцию find. а потом например использовать записанную ссылку с якобы сохраненными элементами... что ты получишь? не ту ли коллекцию которую получил после операции find ? а что бы такого небыло надо клонировать коллекцию... а это время... создавать новую коллекцию тоже время... что к стати выше тратится в пустую.

Не совсем понял возмущение. Что не так?
Сохраняешь ссылку на коллекцию.
var k = $('p');
k.filter('#xx'); // k не поменялась
k = k.filter('#xx'); // k поменялась


Если в одной цепочке работать то есть метод отката к предыдущей разрушенной операции - end(). Не знаю правда запоминает jQuery как-то данные для такого отката или все заново.

Seafnox 12.01.2010 12:36

Я может чего то не понял в вашей дискуссии, но 1) локальные объекты функции уничтожаются, после завершения функции(как в прочем в любом языке)
2) я верно понял что речь идет о локальной переменной obj?
3) это вообще то даже не тестовая, а бэта версия и obj применялся сугубо для моей наглядности, его можно совсем не использовать

оффтоп - зло... поясняйте мои ошибки на примере моего кода пожалуйста.

PeaceCoder 12.01.2010 20:55

Цитата:

Сообщение от micscr
Не знаю правда запоминает jQuery как-то данные для такого отката или все заново.

запоминает. походу это функция pushStack. И работает в цепочке с новым обьектом, передавая его далее. jQ уж больно много лишней работы делает. вот о чем я говорю.


Часовой пояс GMT +3, время: 18:09.