Вывод pdoMenu как на сайте docs.modx.pro

Добрый день!
Ребята, подскажите как вывести меню (на сайте docs.modx.pro/ с левой стороны)? У меня вывести не получается. Помогите с шаблоном вывода pdoMenu. Спасибо.
Алексей
08 апреля 2016, 08:20
modx.pro
1
1 150
0

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

Дмитрий Середюк
11 апреля 2016, 23:30
2
0
Если актуально еще то вот ссылка на пример!

Вызов pdoMenu
[[!pdoMenu?
&parents=`2`
&level=`0`
&outerClass=`anyClass skinClear`
&firstClass=`0`
&lastClass=`0`
&hereClass=`0`
&levelClass=`levels`
&tplInner=`@INLINE <ul>[[+wrapper]]</ul>`
]]

js
(function ($) {
              $.fn.liHarmonica = function (params) {
                var p = $.extend({
                  currentClass: 'cur', //Класс для выделенного пункта меню
                  onlyOne: true, //true - открытым может быть только один пункт, 
                  //false - число открытых одновременно пунктов не ограничено
                  speed: 500 //Скорость анимации
                }, params);
                return this.each(function () {
                  var
                  el = $(this).addClass('harmonica'),
                    linkItem = $('ul', el).prev('a');
                  el.children(':last').addClass('last');
                  $('ul', el).each(function () {
                    $(this).children(':last').addClass('last');
                  });
                  $('ul', el).prev('a').addClass('harFull');
                  el.find('.' + p.currentClass).parents('ul').show().prev('a').addClass(p.currentClass).addClass('harOpen');
                  linkItem.on('click', function () {
                    if ($(this).next('ul').is(':hidden')) {
                      $(this).addClass('harOpen');
                    } else {
                      $(this).removeClass('harOpen');
                    }
                    if (p.onlyOne) {
                      $(this).closest('ul').closest('ul').find('ul').not($(this).next('ul')).slideUp(p.speed).prev('a').removeClass('harOpen');
                      $(this).next('ul').slideToggle(p.speed);
                    } else {
                      $(this).next('ul').stop(true).slideToggle(p.speed);
                    }
                    return false;
                  });
                });
              };
            })(jQuery);
            
            /*Инициализация плагина*/
            $(function () {
              $('.anyClass').liHarmonica({
                onlyOne: false,
                speed: 500
              });
              $('.anyClass2').liHarmonica({
                onlyOne: false,
                speed: 400
              });
            });

css
/*skin Clear [.skinClear]*/
 .skinClear, .skinClear ul {
  list-style:none;
  padding:0;
  margin:0;
  font:14px/1.2em Arial, Helvetica, sans-serif
}
.skinClear ul {
  display:none;
  margin:0 0 0 10px;
  
}
.skinClear li {
  list-style:none;
}
.skinClear a {
  color:#888;
  display:block;
  position:relative;
  text-decoration:none;
  padding:1px 0 1px 9px;
}
.skinClear a:before {
  content:'';
  width: 0;
  height: 0;
  border:0;
  display:inline-block;
  position:absolute;
  top:5px;
  left:0px;
  margin:0 4px 0 0;
}
.skinClear a.harFull.harOpen:before {
  border:0;
  border-left: 3px solid transparent;
  border-top: 4px solid #000;
  border-right: 3px solid transparent;
  top:7px;
}
.skinClear a.harFull:before {
  border:0;
  border-top: 3px solid transparent;
  border-left: 4px solid #000;
  border-bottom: 3px solid transparent;
  top:5px;
}
.skinClear a:hover {
  text-decoration:underline;
}
.skinClear a.cur {
  color:#000
}
.skinClear a.harOpen {
  color:#000
}

ссылка на источник!
    Алексей
    12 апреля 2016, 10:53
    0
    Дмитрий, спасибо огромное. Я уже и не надеялся!
    Авторизуйтесь или зарегистрируйтесь, чтобы оставлять комментарии.
    2