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

@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 ....
если нет саб категории то открыть то что есть в категории. А у меня сейчас не переходит на категорию, а просто открывает список.(+/-)

Новые блоги и статьи Все статьи Все блоги /
SDL3 для Web (WebAssembly): Идентификация объектов на Box2D v3 - использование userData и событий коллизий 8Observer8 02.03.2026 Содержание блога Финальная демка в браузере. Итоговый код: finish-collision-events-sdl3-c. zip https:/ / www. cyberforum. ru/ blog_attachment. php?attachmentid=11680&d=1772460536 Одним из. . .	Реалии Hrethgir 01.03.2026 Нет, я не закончил до сих пор симулятор. Эта задача сложнее. Не получилось уйти в плавсостав, но оно и к лучшему, возможно. Точнее получалось - но сварщиком в палубную команду, а это значит, в моём. . .	Ритм жизни kumehtar 27.02.2026 Иногда приходится жить в ритме, где дел становится всё больше, а вовлечения в происходящее — всё меньше. Плотный график не даёт вниманию закрепиться ни на одном событии. Утро начинается с быстрых,. . .	SDL3 для Web (WebAssembly): Сборка библиотек: SDL3, Box2D, FreeType, SDL3_ttf, SDL3_mixer и SDL3_image из исходников с помощью CMake и Emscripten 8Observer8 27.02.2026 Недавно вышла версия 3. 4. 2 библиотеки SDL3. На странице официальной релиза доступны исходники, готовые DLL (для x86, x64, arm64), а также библиотеки для разработки под Android, MinGW и Visual Studio. . . .
SDL3 для Web (WebAssembly): Реализация движения на Box2D v3 - трение и коллизии с повёрнутыми стенами 8Observer8 20.02.2026 Содержание блога Box2D позволяет легко создать главного героя, который не проходит сквозь стены и перемещается с заданным трением о препятствия, которые можно располагать под углом, как верхнее. . .	Конвертировать закладки radiotray-ng в m3u-плейлист damix 19.02.2026 Это можно сделать скриптом для PowerShell. Использование . \СonvertRadiotrayToM3U. ps1 <path_to_bookmarks. json> Рядом с файлом bookmarks. json появится файл bookmarks. m3u с результатом. # Check if. . .	Семь CDC на одном интерфейсе: 5 U[S]ARTов, 1 CAN и 1 SSI Eddy_Em 18.02.2026 Постепенно допиливаю свою "многоинтерфейсную плату". Выглядит вот так: https:/ / www. cyberforum. ru/ blog_attachment. php?attachmentid=11617&stc=1&d=1771445347 Основана на STM32F303RBT6. На борту пять. . .	Камера Toupcam IUA500KMA Eddy_Em 12.02.2026 Т. к. у всяких "хикроботов" слишком уж мелкий пиксель, для подсмотра в ESPriF они вообще плохо годятся: уже 14 величину можно рассмотреть еле-еле лишь на экспозициях под 3 секунды (а то и больше),. . .

@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

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

Решение