Раскрывающийся список

@DNikolaev · Регистрация: 20.05.2015

Студворк — интернет-сервис помощи студентам

Доброго всем времени суток.
Подскажите, где то косякнул...

CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
.widget_product_categories{
  width:100%;
  height:auto;
  /*padding:32px 0px 1px 0px;
  background:url(/wp-content/image/widget_menu_cat/menu-side-2-top.png) 0px 0px / 100% 534px no-repeat,url(/wp-content/image/widget_menu_cat/menu-side-2-mid.png) 0px 0px repeat-y;*/
  border-radius:0px 0px 8px 8px;
  overflow:hidden;
  box-sizing:border-box;
}
.widget_product_categories .h1{color:#ffffff; padding-left:21px;}
.widget_product_categories ul{
  display:block;
  list-style: none;
    margin: 0px 0px 0px 0px;
  padding:0px;
  list-style:none;
}
.widget_product_categories > ul > li:first-child{border:0px;}
.widget_product_categories ul li{
  display:block;
  margin:0px;
  padding:0px;
  /*border-top:1px solid #777777;*/
}
.widget_product_categories ul li span{display:none}
.widget_product_categories ul li li span{display:inline-block}
.widget_product_categories ul li a{
  display:inline-block;
  padding:4px 7px 4px 30px;
  background:url(/wp-content/image/widget_cat/vmenu-li.png) 5px 6px no-repeat;
  text-transform:uppercase;
  font-size:12px;
  font-weight:500;
  text-decoration:none;
}
.widget_product_categories ul li a:hover{background-color:rgba(229, 229, 229, 1);}
.widget_product_categories > ul > li.act > a{background:url(/wp-content/image/widget_cat/vmenu-li.png) 5px -46px no-repeat rgba(229, 229, 229,0.4);}
.widget_product_categories ul li li a{
  padding: 2px 7px 2px 39px;
  /*background:url(/wp-content/image/widget_menu_cat/vmenu-li-li.png) 28px 16px no-repeat;*/
  text-transform:none;
  font-size:12px;
  font-weight:normal;
  text-decoration:none;
  background: none;
}
.widget_product_categories ul li li a:hover, .widget woocommerce widget_product_categories ul li li.current-cat-item a{
  background:url(/wp-content/image/widget_cat/vmenu-li-li.png) 18px -40px no-repeat, url(/wp-content/image/widget_cat/vmenu-li-a-act.png) 0px 100% repeat-x #ffffff; 
  color: #dd3333;
}
.widget_product_categories ul ul{display:none;}
.widget_product_categories ul li.current-cat-item ul, .widget woocommerce widget_product_categories ul li.current-cat-parent ul{display:block;}

Проблема в следующем. Список изначально отображается в свернутом виде, щелкаешь по тому что надо раскрыть - супер, все раскрылось. А вот повторно щелкнуть на тот же пункт чтобы скрылось не получается ((( + развернуть (работает), а - свернуть обратно (не работает).
Подскажите что не так.

@Freeze_Breeze · 06.09.2017, 09:54

А почему нужно щелкать по менюшке? Сделай что бы было через :hover и нет проблем с щелканьем и удобнее так, когда при наведении

Добавлено через 2 минуты
Ну а если нужно с кликом что бы было, тогда подключай jQuery и используй событие .click

@DNikolaev · 07.09.2017, 16:50 **[ТС]**

Freeze_Breeze, Хотелось бы без hover и click. Сейчас все работает, нажал - список открылся, вот как сделать при повторном нажатии чтобы он закрылся?

@Freeze_Breeze · 07.09.2017, 17:13

https://daneden.github.io/animate.css/ Посмотри может тут что то есть

Добавлено через 4 минуты
А вот то, что тебе нужно https://ruseller.com/lessons.php?rub=2&id=2479 Удачи.

@DNikolaev · 07.09.2017, 17:18 **[ТС]**

Freeze_Breeze, тут поинтереснее http://dbmast.ru/5-variantov-o... -akkordeon. Но все равно спасибо

@DNikolaev · 11.09.2017, 12:55 **[ТС]**

Все же прошу помощи. Уже запутался

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
$=jQuery;
$(document).ready(function(){
    $(".widget_product_categories > ul > li > a").on("click", function(){
        var XX=$(this).parent("li");
        if(!XX.hasClass("act")){
            $(".widget_product_categories > ul > li.act > ul").slideUp(500);
            $(".widget_product_categories > ul > li.act").removeClass("act");
            XX.addClass("act");
            XX.children("ul").slideDown(500);
        }
        return false;
    });
    $(".widget_product_categories > ul > li.current-cat-item, .widget_product_categories > ul > li.current-cat-parent").addClass("act");
});

Как все же при повторном клике свернуть список?

Добавлено через 1 час 21 минуту
с раскрытием / закрытием разобрался, кому интересно

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<script>
$=jQuery;
$(document).ready(function(){
    $(".widget_product_categories > ul > li > a").on("click", function(){
        var XX=$(this).parent("li");
        if(!XX.hasClass("act")){
            $(".widget_product_categories > ul > li.act > ul").slideUp(500);
            $(".widget_product_categories > ul > li.act").removeClass("act");
            XX.addClass("act");
            XX.children("ul").slideDown(500);
        }   else {  
                    $(".widget_product_categories > ul > li.act > ul").slideUp(500);  //
             $(".widget_product_categories > ul > li.act").removeClass("act");
                }
        return false;
    });
    $(".widget_product_categories > ul > li.current-cat-item, .widget_product_categories > ul > li.current-cat-parent").removeClass("act");
            XX.addClass("act");
});
  </script>

Вопрос далее... Если нет подменю, то как открыть само меню?
К примеру... Меню - подменю... если нет подменю, то открыть само меню

@Freeze_Breeze · 11.09.2017, 13:21

Не совсем понял твою идею

Вопрос далее... Если нет подменю, то как открыть само меню? К примеру... Меню - подменю... если нет подменю, то открыть само меню

но возможно тебе это поможет? https://www.youtube.com/watch?v=tgVen6pc6i0 Если я не так понял, то напиши более конкретней что тебе нужно.

@DNikolaev · 11.09.2017, 14:17 **[ТС]**

Freeze_Breeze, на данный момент нажимаешь пункт меню и если там есть подменю (меню1 - саб меню1), то плюсик меняется на минус и раскрывается список "меню 1", где можно выбрать "саб меню 1". Но если этого саб меню нет то при нажатии "меню1" я не могу перейти в раздел "Меню1", просто раскроется список пусой. А мне необходимо если нет "саб меню" то открыть родителя "Меню"

Добавлено через 9 минут
Одним словом так:
1 категория
1.1 саб категория
2 категория
3 ....
если нет саб категории то открыть то что есть в категории. А у меня сейчас не переходит на категорию, а просто открывает список.(+/-)

Новые блоги и статьи Все статьи Все блоги /
Thinkpad X220 Tablet — это лучший бюджетный ноутбук для учёбы, точка. Programma_Boinc 23.12.2025 Thinkpad X220 Tablet — это лучший бюджетный ноутбук для учёбы, точка. Рецензия / Мнение/ Перевод https:/ / **********/ gallery/ thinkpad-x220-tablet-porn-gzoEAjs . . .	PhpStorm 2025.3: WSL Terminal всегда стартует в ~ and_y87 14.12.2025 PhpStorm 2025. 3: WSL Terminal всегда стартует в ~ (home), игнорируя директорию проекта Симптом: После обновления до PhpStorm 2025. 3 встроенный терминал WSL открывается в домашней директории. . .	Как объединить две одинаковые БД Access с разными данными VikBal 11.12.2025 Помогите пожалуйста !! Как объединить 2 одинаковые БД Access с разными данными.	Новый ноутбук volvo 07.12.2025 Всем привет. По скидке в "черную пятницу" взял себе новый ноутбук Lenovo ThinkBook 16 G7 на Амазоне: Ryzen 5 7533HS 64 Gb DDR5 1Tb NVMe 16" Full HD Display Win11 Pro	Музыка, написанная Искусственным Интеллектом volvo 04.12.2025 Всем привет. Некоторое время назад меня заинтересовало, что уже умеет ИИ в плане написания музыки для песен, и, собственно, исполнения этих самых песен. Стихов у нас много, уже вышли 4 книги, еще 3. . .
От async/await к виртуальным потокам в Python IndentationError 23.11.2025 Армин Ронахер поставил под сомнение async/ await. Создатель Flask заявляет: цветные функции - провал, виртуальные потоки - решение. Не threading-динозавры, а новое поколение лёгких потоков. Откат?. . .	Поиск "дружественных имён" СОМ портов Argus19 22.11.2025 Поиск "дружественных имён" СОМ портов На странице: https:/ / norseev. ru/ 2018/ 01/ 04/ comportlist_windows/ нашёл схожую тему. Там приведён код на С++, который показывает только имена СОМ портов, типа,. . .	Сколько Государство потратило денег на меня, обеспечивая инсулином. Programma_Boinc 20.11.2025 Сколько Государство потратило денег на меня, обеспечивая инсулином. Вот решила сделать интересный приблизительный подсчет, сколько государство потратило на меня денег на покупку инсулинов. . . .	Ломающие изменения в C#.NStar Alpha Etyuhibosecyu 20.11.2025 Уже можно не только тестировать, но и пользоваться C#. NStar - писать оконные приложения, содержащие надписи, кнопки, текстовые поля и даже изображения, например, моя игра "Три в ряд" написана на этом. . .	Мысли в слух kumehtar 18.11.2025 Кстати, совсем недавно имел разговор на тему медитаций с людьми. И обнаружил, что они вообще не понимают что такое медитация и зачем она нужна. Самые базовые вещи. Для них это - когда просто люди. . .

@Freeze_Breeze 278 / 272 / 106 Регистрация: 12.01.2016 Сообщений: 1,666
	06.09.2017, 09:54
	А почему нужно щелкать по менюшке? Сделай что бы было через `:hover` и нет проблем с щелканьем и удобнее так, когда при наведении Добавлено через 2 минуты Ну а если нужно с кликом что бы было, тогда подключай jQuery и используй событие `.click` 0

@DNikolaev 1 / 1 / 1 Регистрация: 20.05.2015 Сообщений: 46
	07.09.2017, 16:50 [ТС]
	Freeze_Breeze, Хотелось бы без hover и click. Сейчас все работает, нажал - список открылся, вот как сделать при повторном нажатии чтобы он закрылся? 0

@Freeze_Breeze 278 / 272 / 106 Регистрация: 12.01.2016 Сообщений: 1,666
	07.09.2017, 17:13
	Сообщение было отмечено DNikolaev как решение Решение https://daneden.github.io/animate.css/ Посмотри может тут что то есть Добавлено через 4 минуты А вот то, что тебе нужно https://ruseller.com/lessons.php?rub=2&id=2479 Удачи. 1

@DNikolaev 1 / 1 / 1 Регистрация: 20.05.2015 Сообщений: 46
	07.09.2017, 17:18 [ТС]
	Freeze_Breeze, тут поинтереснее http://dbmast.ru/5-variantov-o... -akkordeon. Но все равно спасибо 0

@DNikolaev 1 / 1 / 1 Регистрация: 20.05.2015 Сообщений: 46
	11.09.2017, 14:17 [ТС]
	Freeze_Breeze, на данный момент нажимаешь пункт меню и если там есть подменю (меню1 - саб меню1), то плюсик меняется на минус и раскрывается список "меню 1", где можно выбрать "саб меню 1". Но если этого саб меню нет то при нажатии "меню1" я не могу перейти в раздел "Меню1", просто раскроется список пусой. А мне необходимо если нет "саб меню" то открыть родителя "Меню" Добавлено через 9 минут Одним словом так: 1 категория 1.1 саб категория 2 категория 3 .... если нет саб категории то открыть то что есть в категории. А у меня сейчас не переходит на категорию, а просто открывает список.(+/-) 0

Раскрывающийся список

Решение