2016-03-27 2 views
0

Я работаю над шаблоном Wordpress, и одна из функций - выпадающее меню в заголовке. Вы щелкаете стрелкой, чтобы открыть ее, и она остается открытой, пока вы не нажмете стрелку, чтобы закрыть ее. Но когда вы нажимаете на одну из ссылок, она остается открытой на следующей странице. Вы должны нажать на стрелку, чтобы закрыть ее.Как отклонить раскрывающееся меню в шаблоне WordPress на новой странице

Я бы хотел, чтобы выпадающее меню автоматически закрывалось при переходе на новую страницу. Вот мой js для навигации ... Я следую учебнику от Lynda, поэтому я не писал этот код, но у меня не было достаточного опыта работы с js, чтобы узнать, какой раздел кода выполняет то, что именно.

Пожалуйста, дайте мне знать, если вам нужна какая-либо другая информация.

function initMainNavigation(container) { 
    // Add dropdown toggle that display child menu items. 
    container.find('.menu-item-has-children > a').after('<button class="dropdown-toggle" aria-expanded="false">' + screenReaderText.expand + '</button>'); 

// Toggle buttons and submenu items with active children menu items. 
container.find('.current-menu-ancestor > button').addClass('toggle-on'); 
container.find('.current-menu-ancestor > .sub-menu').addClass('toggled-on'); 

container.find('.dropdown-toggle').click(function(e) { 
    var _this = $(this); 
    e.preventDefault(); 
    _this.toggleClass('toggle-on'); 
    _this.next('.children, .sub-menu').toggleClass('toggled-on'); 
    _this.attr('aria-expanded', _this.attr('aria-expanded') === 'false' ? 'true' : 'false'); 
    _this.html(_this.html() === screenReaderText.expand ? screenReaderText.collapse : screenReaderText.expand); 
}); 
} 

initMainNavigation($('.main-navigation')); 

// Re-initialize the main navigation when it is updated, persisting any existing submenu expanded states. 
$(document).on('customize-preview-menu-refreshed', function(e, params) { 
    if ('primary' === params.wpNavMenuArgs.theme_location) { 
     initMainNavigation(params.newContainer); 

    // Re-sync expanded states from oldContainer. 
    params.oldContainer.find('.dropdown-toggle.toggle-on').each(function() { 
     var containerId = $(this).parent().prop('id'); 
     $(params.newContainer).find('#' + containerId + ' > .dropdown-toggle').triggerHandler('click'); 
    }); 
} 
}); 

ответ

0

Пожалуйста, используйте следующие ссылки для создания меню wordpress. http://cssmenumaker.com/blog/wordpress-3-drop-down-menu-tutorial

Прочтите инструкции, приведенные на нем, и применяйте шаг за шагом.

+0

Я ценю учебное пособие, но это, кажется, использует несколько иной подход, чем тот, который я использую в настоящее время. Еще раз спасибо, но это не совсем то, что я искал. –

0

Я знаю, что этот вопрос почти год, но я хотел пойти дальше и опубликовать ответ на случай, если кому-то это понадобится в будущем.

Следующие строки вашего кода - вот что заставляет переключатели оставаться открытыми, когда вы переходите на новую страницу.

// Toggle buttons and submenu items with active children menu items. 
container.find('.current-menu-ancestor > button').addClass('toggle-on'); 
container.find('.current-menu-ancestor > .sub-menu').addClass('toggled-on'); 

При переходе на страницу, которая является частью подменит, эти строки автоматически добавить класс «тумблер на» к соответствующей кнопке переключения и родительским подменит эту страницу. Если вы закомментируете эти строки, подменю закрываются при переходе на новую страницу.

Смежные вопросы