поиск классов внутри тега
помогите дописать скрипт
если внутри тега с классом .main есть тег с классом .main2, то для всех тегов с именами классов .sub расположенных после найденного .main2 и до ближайшего класса .end (их там несколько) задать стиль display:inline main2list = $('.main').find('.main2'); if (???){ main2list.find('.sub, .end').each( function() { if ($(this).hasclass('.sub')) $(this).css('display', 'inline') if ($(this).hasclass('.end')) return; } ); } |
yozuul, ты хоть ХТМЛ разметку свою покажи... :D
|
Цитата:
main2list = $('.main .main2'); |
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <div class="main"> <div class="main2">1</div> <div class="sub">2</div> <div class="sub">3</div> <div class="end">4</div> <div class="sub">5</div> <div class="sub">6</div> <div class="end">7</div> </div> <script> $('.main .main2 ~ .sub').filter(':not(.end ~ .sub)').css('color', 'red'); </script> |
Цитата:
<ul id="main_menu"> <li class="shme_a"></li> <li class="shme_aa"></li> <li class="shme_aa"></li> <li class="shme_s"></li> <li class="shme_a"></li> </ul> родительским элементам задается класс .shme_a, всем дочерним, в зависимости от вложенности .shme_aa, shme_aaa и тд. активным родительским элементам задается класс .shme_s, всем дочерним, в зависимости от вложенности .shme_ss, shme_sss и тд. Нужно скрывать и раскрывать меню в зависимости от выбранных элементов. по умолчанию все дочерние теги скрыты devote, красиво) все работает так как и спрашивал, но к моему примеру все равно не подходит. не пойму как это реализовать. |
Цитата:
Цитата:
|
Цитата:
Так ты сделай нормальный пример... Нормально задай вопрос по твоему же примеру... Оно гляди и прояснится! ;) |
Цитата:
<ul id="main_menu"> <li class="shme_a"> <ul> <li class="shme_aa"></li> <li class="shme_aa"></li> </ul> </li> <li class="shme_s"></li> <li class="shme_a"></li> </ul> А у тебя один уровень. |
Цитата:
многоуровневое меню. <ul id="main_menu"> <li class="shme_a"></li> <li class="shme_aa"></li> <li class="shme_aa"></li> <li class="shme_s"></li> <li class="shme_a"></li> </ul> родительским элементам задается класс .shme_a, всем дочерним, в зависимости от вложенности .shme_aa, shme_aaa и тд. активным родительским элементам задается класс .shme_s, всем дочерним, в зависимости от вложенности .shme_ss, shme_sss и тд. Нужно скрывать и раскрывать меню в зависимости от выбранных элементов. 1. Если внутри #main_menu в .li не встречается буква 's', то css для .li с именами классов с кол-вом букв 'а' > 1 - стиль display:none //если ни один из родительских элементов не выбран - скрываем все дочерние 2. Если внутри #main_menu в .li встречается одна буква 's', то css для .li с именами классов с кол-вом букв 'а' > 2, и .li c именами классов с кол-вом букв 'a' > 1, раположенных перед найденным .li с буквой 's' и после ближайшего .li с кол-вом букв 'a'=1 - стиль display:none //если выбран любой родительский, то раскрываем его второй уровень, и скрываем все дочерние др. родительских и скрываем дочерние 3 и более уровней текущего 3. Если внутри #main_menu в .li встречается две буквы 's', то css для .li с именами классов с кол-вом букв 'а' > 1, расположенных перед найденным 's' и после ближайшего 'a'< 3 - стиль display:none //если выбран третий уровень меню, скрываем все меню 2 и 3 уровня др. родительских. |
Цитата:
|
но сдается мне - это все танцы с бубном
|
Цитата:
|
Цитата:
|
Вот тут действительно многоуровневое меню...
http://xandeadx.ru/blog/javascript/5 |
и в чем же разница? в том что подразделы заключены в еще одни теги <ul>?
<ul id="main_menu"> <li class="shme_a">Раздел 1</li> <li class="shme_aa">Подраздел 1</li> <li class="shme_aa">Подраздел 2</li> <li class="shme_s">Раздел 2</li> <li class="shme_a">Раздел 3</li> </ul> так понятнее будет? |
Цитата:
|
Цитата:
Цитата:
|
так или иначе, меню отражает реальную иерархию сайта, где категории вложены одна в другую. меню формируется движком, я его руками не прописываю.
<ul class="menu_m_s"> <li class="shme_s"><a href="/shop/cat/" alt="Кошки">Товары для кошек</a></li> <li class="shme_aa"><a href="/shop/cat/cats_fav_food/" alt="Лакомства для кошек">Лакомства для кошек</a></li> <li class="shme_aa"><a href="/shop/cat/c_korm/" alt="Корма">Корма</a></li> <li class="shme_aaa"><a href="/shop/cat/c_korm/bozita/" alt="Бозита">Бозита</a></li> <li class="shme_aaa"><a href="/shop/cat/c_korm/brit/" alt="Брит">Брит</a></li> <li class="shme_aaa"><a href="/shop/cat/c_korm/yams/" alt="Ямс">Ямс</a></li> <li class="shme_aaa"><a href="/shop/cat/c_korm/eucanuba/" alt="Эукануба">Эукануба</a></li> <li class="shme_aaa"><a href="/shop/cat/c_korm/hills/" alt="Хиллс">Хиллс</a></li> <li class="shme_aaa"><a href="/shop/cat/c_korm/friskies/" alt="Фрискис">Фрискис</a></li> <li class="shme_aaa"><a href="/shop/cat/c_korm/kitekat/" alt="Китикет">Китикет</a></li> <li class="shme_aaa"><a href="/shop/cat/c_korm/perfect-fit/" alt="Перфект Фит">Перфект Фит</a></li> <li class="shme_aaa"><a href="/shop/cat/c_korm/royal-canin/" alt="Роял Канин">Роял Канин</a></li> <li class="shme_aaa"><a href="/shop/cat/c_korm/whiskas/" alt="Whiskas">Вискас</a></li> <li class="shme_aaa"><a href="/shop/cat/c_korm/chetveronogiy-gurman/" alt="Четвероногий Гурман">Четвероногий Гурман</a></li> <li class="shme_aaa"><a href="/shop/cat/c_korm/other-cat/" alt="Другие корма для кошек">Другие корма для кошек</a></li> <li class="shme_aaa"><a href="/shop/cat/c_korm/new_cats_food/" alt="Новый корм">Новый корм</a></li> <li class="shme_aa"><a href="/shop/cat/c_kosm/" alt="Косметика и уход">Косметика и уход</a></li> <li class="shme_aa"><a href="/shop/cat/c_gig/" alt="Гигиена">Гигиена</a></li> <li class="shme_aa"><a href="/shop/cat/c_acss/" alt="Аксессуары">Аксессуары</a></li> <li class="shme_aaa"><a href="/shop/cat/c_acss/bed/" alt="Лежаки">Лежаки</a></li> <li class="shme_aaa"><a href="/shop/cat/c_acss/collar/" alt="Поводки, шлейки, ошейники">Поводки, шлейки, ошейники</a></li> <li class="shme_aaa"><a href="/shop/cat/c_acss/toys/" alt="Игрушки">Игрушки</a></li> <li class="shme_aa"><a href="/shop/cat/c_odejda/" alt="Одежда">Одежда</a></li> <li class="shme_a"><a href="/shop/dog/" alt="Собаки">Товары для собак</a></li> <li class="shme_aa"><a href="/shop/dog/dog-food/" alt="Корма для собак">Корма</a></li> <li class="shme_aaa"><a href="/shop/dog/dog-food/hills-dog/" alt="Хиллс">Хиллс</a></li> <li class="shme_aaa"><a href="/shop/dog/dog-food/brit-d/" alt="Брит">Брит</a></li> <li class="shme_aaa"><a href="/shop/dog/dog-food/chappi-d/" alt="Чаппи">Чаппи</a></li> <li class="shme_aaa"><a href="/shop/dog/dog-food/eukanuba-d/" alt="Эукануба">Эукануба</a></li> <li class="shme_aaa"><a href="/shop/dog/dog-food/pedigree-d/" alt="Педигри">Педигри</a></li> <li class="shme_aaa"><a href="/shop/dog/dog-food/pro-pac-d/" alt="Про Пак">Про Пак</a></li> <li class="shme_aaa"><a href="/shop/dog/dog-food/d-royal-canin/" alt="Роял Канин для собак">Роял Канин</a></li> <li class="shme_aaa"><a href="/shop/dog/dog-food/4-gurman-d/" alt="Четвероногий гурман">Четвероногий гурман</a></li> <li class="shme_aaa"><a href="/shop/dog/dog-food/other-d/" alt="Другие корма для собак">Другие корма для собак</a></li> <li class="shme_aa"><a href="/shop/dog/dog_fav_food/" alt="Лакомства для собак">Лакомства для собак</a></li> <li class="shme_aa"><a href="/shop/dog/dog_cosm/" alt="Косметика и уход для собак">Косметика и уход для собак</a></li> <li class="shme_aa"><a href="/shop/dog/dog_gigiena/" alt="Гигиена для собак">Гигиена для собак</a></li> <li class="shme_aa"><a href="/shop/dog/dog_acss/" alt="Аксессуары для собак">Аксессуары для собак</a></li> <li class="shme_aaa"><a href="/shop/dog/dog_acss/toys-d/" alt="Игрушки для собак">Игрушки для собак</a></li> <li class="shme_aaa"><a href="/shop/dog/dog_acss/bed-d/" alt="Лежаки для собак">Лежаки для собак</a></li> <li class="shme_aaa"><a href="/shop/dog/dog_acss/bowl-d/" alt="Посуда">Посуда</a></li> <li class="shme_aaa"><a href="/shop/dog/dog_acss/brush-d/" alt="Щетки, расчёски">Щетки, расчёски</a></li> <li class="shme_aaa"><a href="/shop/dog/dog_acss/collar-d/" alt="Поводки, шлейки, ошейники для собак">Поводки, шлейки, ошейники для собак</a></li> <li class="shme_aa"><a href="/shop/dog/dog_cl/" alt="Одежда для собак">Одежда для собак</a></li> <li class="shme_a"><a href="/shop/bird/" alt="Птицы">Товары для птиц</a></li> <li class="shme_aa"><a href="/shop/bird/bird_food/" alt="Корма для птиц">Корма для птиц</a></li> <li class="shme_aa"><a href="/shop/bird/bird_fav/" alt="Лакомства для птиц">Лакомства для птиц</a></li> <li class="shme_aa"><a href="/shop/bird/bird_kletki/" alt="Клетки для птиц">Клетки для птиц</a></li> <li class="shme_aa"><a href="/shop/bird/bird_acss/" alt="Аксессуары для птиц">Аксессуары для птиц</a></li> <li class="shme_a"><a href="/shop/rodent/" alt="Грызуны">Товары для грызунов</a></li> <li class="shme_aa"><a href="/shop/rodent/rodent_food/" alt="Корма для грызунов">Корма для грызунов</a></li> <li class="shme_aa"><a href="/shop/rodent/rodent_fav/" alt="Лакомства для грызунов">Лакомства для грызунов</a></li> <li class="shme_aa"><a href="/shop/rodent/rodent_kletki/" alt="Клетки для грызунов">Клетки для грызунов</a></li> <li class="shme_aa"><a href="/shop/rodent/rodent_acss/" alt="Аксессуары для грызунов">Аксессуары для грызунов</a></li> <li class="shme_a"><a href="/shop/fish/" alt="Рыбки">Товары для рыбок</a></li> <li class="shme_aa"><a href="/shop/fish/fish_food/" alt="Корма для рыбок">Корма для рыбок</a></li> <li class="shme_aa"><a href="/shop/fish/fish_acss/" alt="Аксессуары для рыбок">Аксессуары для рыбок</a></li> <li class="shme_aa"><a href="/shop/fish/fish_obor/" alt="Оборудование для рыбок">Оборудование для рыбок</a></li> <li class="shme_a"><a href="/shop/horse/" alt="Лошади">Товары для лошадей</a></li> <li class="shme_aa"><a href="/shop/horse/horse_cosm/" alt="Косметика и уход для лошадей">Косметика и уход для лошадей</a></li> <li class="shme_aa"><a href="/shop/horse/horse_acss/" alt="Аксессуары для лошадей">Аксессуары для лошадей</a></li> <li class="shme_a"><a href="/shop/reptile/" alt="Рептилии">Товары для рептилий</a></li> <li class="shme_aa"><a href="/shop/reptile/reptile_food/" alt="Корма для рептилий">Корма для рептилий</a></li> <li class="shme_aa"><a href="/shop/reptile/reptile_acss/" alt="Аксессуары для рептилий">Аксессуары для рептилий</a></li> <li class="shme_aa"><a href="/shop/reptile/reptile_obor/" alt="Оборудование для рептилий">Оборудование для рептилий</a></li> <li class="shme_a"><a href="/shop/ferrets/" alt="Хорьки">Товары для хорьков</a></li> <li class="shme_aa"><a href="/shop/ferrets/ferrets_food/" alt="Корма для хорьков">Корма для хорьков</a></li> <li class="shme_aa"><a href="/shop/ferrets/ferrets_cosm/" alt="Косметика и уход для хорьков">Косметика и уход для хорьков</a></li> <li class="shme_aa"><a href="/shop/ferrets/ferrets_acss/" alt="Аксессуары для хорьков">Аксессуары для хорьков</a></li> <li class="shme_a"><a href="/shop/company/" alt="Производители">Производители</a></li> <li class="shme_aa"><a href="/shop/company/bozita_pr/" alt="Бозита">Бозита</a></li> <li class="shme_aa"><a href="/shop/company/brit-pr/" alt="Брит">Брит</a></li> <li class="shme_aa"><a href="/shop/company/doktor-klauder-pr/" alt="Доктор Клаудер">Доктор Клаудер</a></li> <li class="shme_aa"><a href="/shop/company/eukanuba-pr/" alt="Эукануба">Эукануба</a></li> <li class="shme_aa"><a href="/shop/company/hills-pr/" alt="Хиллс">Хиллс</a></li> <li class="shme_aa"><a href="/shop/company/friskis-pr/" alt="Фрискис">Фрискис</a></li> <li class="shme_aa"><a href="/shop/company/kitiket-pr/" alt="Китикет">Китикет</a></li> <li class="shme_aa"><a href="/shop/company/perfekt-fit-pr/" alt="Перфект Фит">Перфект Фит</a></li> <li class="shme_aa"><a href="/shop/company/royal-kanin-pr/" alt="Роял Канин">Роял Канин</a></li> <li class="shme_aa"><a href="/shop/company/wiskas-pr/" alt="Вискас">Вискас</a></li> <li class="shme_aa"><a href="/shop/company/4-gurman-pr/" alt="Четвероногий Гурман">Четвероногий Гурман</a></li> <li class="shme_aa"><a href="/shop/company/chappi-pr/" alt="Чаппи">Чаппи</a></li> <li class="shme_aa"><a href="/shop/company/pedigree-pr/" alt="Педигри">Педигри</a></li> <li class="shme_aa"><a href="/shop/company/pro-pak-pr/" alt="Про Пак">Про Пак</a></li> </ul> хорошо. пусть будет одноуровневое. что изменится от этого? |
Да пойми ты.. от того что ты постаил пару пробелов (или таб) перед <li> - ещё не значит что образовал новый уровень. У тебя сейчас тупо большой одноуровний список с одним классом.
|
Цитата:
Цитата:
|
Цитата:
Цитата:
|
Цитата:
|
Цитата:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <style> .shme_aa, .shme_aaa { display: none; } </style> <ul class="menu_m_s"> <li class="shme_a"><a href="/shop/cat/" alt="Кошки">Товары для кошек</a></li> <li class="shme_aa"><a href="/shop/cat/cats_fav_food/" alt="Лакомства для кошек">Лакомства для кошек</a></li> <li class="shme_aa"><a href="/shop/cat/c_korm/" alt="Корма">Корма</a></li> <li class="shme_aaa"><a href="/shop/cat/c_korm/bozita/" alt="Бозита">Бозита</a></li> <li class="shme_a"><a href="/shop/dog/" alt="Собаки">Товары для собак</a></li> <li class="shme_aa"><a href="/shop/dog/dog-food/" alt="Корма для собак">Корма</a></li> <li class="shme_aaa"><a href="/shop/dog/dog-food/hills-dog/" alt="Хиллс">Хиллс</a></li> <li class="shme_aaa"><a href="/shop/dog/dog-food/brit-d/" alt="Брит">Брит</a></li> </ul> <script type="text/javascript"> $(function() { $('.shme_a a').click(function(e) { var keep = false; $(this).parent().find('~ .shme_a, ~ li.shme_aa').filter(function() { return !(keep = !keep ? $(this).hasClass('shme_a') : 1); }).slideToggle(); e.preventDefault(); }); $('.shme_aa a').click(function(e) { var keep = false; $(this).parent().find('~ .shme_aa, ~ li.shme_aaa').filter(function() { return !(keep = !keep ? $(this).hasClass('shme_aa') : 1); }).slideToggle(); e.preventDefault(); }); }); </script>Тока нафига так извращаться то??? |
Цитата:
Цитата:
|
Цитата:
Нынче любой паршивый двиг может сгенерировать нормальный многоуровневый список. |
Часовой пояс GMT +3, время: 05:46. |