Вывод меню через pdoMenu

Всем привет!
Помогите вывести меню через pdoMenu.
Есть меню на сайте которое выползает по клику, и выводится все родительские категории, как добавить к этому еще и вывод дочерних категорий при наведении?
Есть такой код менюшки, но он выводит только дочерние категории(
<li class="dropdown le-dropdown">
		<a href="#" class="dropdown-toggle" data-toggle="dropdown">
		<i class="fa fa-list"></i> Каталог товаров
		</a>
	<ul class="dropdown-menu">
		<li><a href="#">Категория 1</a></li>
		<li><a href="#">Категория 2</a></li>
		<li><a href="#">Категория 3</a></li>
		<li><a href="#">Категория 4</a></li>
		<li><a href="#">Категория 5</a></li>
		<li><a href="#">Категория 6</a></li>
		<li><a href="#">Категория 7</a></li>
	</ul>
</li>
Борис
Борис
24 ноября 2017, 16:34
modx.pro
1 919

Комментарии: 5

Evgesha
Evgesha
25 ноября 2017, 22:38
Задача плохо сформулирована.
Во-первых, это не полное меню у вас переведено, а один из пунктов 1 уровня так?
Если так, то ваша задаче реализуема на css в пару строк.
.dropdown {
  position: relative;
}
.dropdown-menu {
  position: absolute;
  display: none;
}
.dropdown:hover .dropdown-menu {
  display: block;
}
Это так, что бы вы поняли идею реализации, остальное дописывается исхядя из задачи.
    Борис
    Борис
    26 ноября 2017, 23:40
    Да я плохо сформулировал вопрос.
    Попробую еще раз!
    Смотрите, у меня это меню работает вот таким образом s11660.h9.modhost.pro/catalog/
    Если мы кликаем на каталог товаров, вылезает выпадающее меню, но как сделать чтобы подразделы вылезали сбоку при наведении вышкой?
      Борис
      Борис
      26 ноября 2017, 23:42
      То есть категории вылезают отлично, а вот как реализовать подкатегории? Я понимаю что это вопрос более по css, но все же помогите)) Как его потом вывести через pdoMenu это я думаю разберусь наверное)) А вот сам css не получается реализовать(
        Evgesha
        Evgesha
        27 ноября 2017, 22:46
        В общем:

        Для начала скрываем наше меню которые должно выезжать справа, ведь его нет пока что-то не произойдет (в нашем случае hover) заодно напишем немного стилей для его позиционирования
        .dropdownbtn {
  display: none; //скрыли
  position: absolute; // это понадобиться для позиционирования см. ниже
  left: 100%;
  top: 0;
  width: 200px; //поменяете на тот размер который нужен
  box-shadow: 0 6px 12px rgba(0,0,0,.175); //немного соли
}
        Не забываем, что наше меню должно находиться напротив родителя, иначе бред получиться неимоверный все слепиться в кучу… значит что? правильно. позиционировать его надо относительно родителя:
        .mainmenubtn {
  position: relative;
}
        Ну и собственно магия, стили для того, чтобы отобразить меню пока hover на его родителе:
        .mainmenubtn:hover .dropdownbtn {
  display: block;
}
        Что получили в итоге:
        .mainmenubtn {
  position: relative;
}

.dropdownbtn {
  display: none;
  position: absolute;
  left: 100%;
  top: 0;
  width: 200px;
  box-shadow: 0 6px 12px rgba(0,0,0,.175);
}

.mainmenubtn:hover .dropdownbtn {
  display: block;
}
        З.Ы. Кстати у вас там не верная структура, надо каждую ссылку в отдельный 
        <li class="dropdown-child">
        обернуть а не в один.
          Борис
          Борис
          28 ноября 2017, 18:09
          Евгений, ты гений) Спасибо, все заработало более чем)
          Вывел через пдоменю и пдоресурс всю менюшку, работает вроде неплохо, единственное, ширина с родительскими категориями не растягивается в длину названия категории. Но все равно огромное спасибо вам!!!
      Авторизуйтесь или зарегистрируйтесь, чтобы оставлять комментарии.
      5