Показать сообщение отдельно
  #1 (permalink)  
Старый 30.11.2017, 14:36
Новичок на форуме
Отправить личное сообщение для Pichenka94 Посмотреть профиль Найти все сообщения от Pichenka94
 
Регистрация: 30.11.2017
Сообщений: 4

Определение текущей страницы для аккордеон меню
Доброго времени суток! Уже часа 3 пытаюсь сделать так чтобы в аккордеон меню (код ниже) при загрузке страницы разворачивалась та часть что содержит пункт с текущей страницей. Но моих знаний JS катострофически не хватает, помогите пожалуйста ввести данную фичу.

HTML составляющая:
<nav id="main" class="menu_boutique-area">
<ul class="liste-categories">


<li><strong class="categories-item"><a><em class="fa fa-chevron-circle-right">&nbsp;&nbsp;</em> Категория 1 </a></strong>
<ul class="liste-produits">
<li><a href="/категория1/подкатегория1.html" class="produit-item"><em class="fa fa-chevron-circle-right">&nbsp;&nbsp;</em> Подкатегория 1</a></li>
<li><a href="/категория1/подкатегория2.html" class="produit-item"><em class="fa fa-chevron-circle-right">&nbsp;&nbsp;</em> Подкатегория 2</a></li>
<li><a href="/категория1/подкатегория3.html" class="produit-item"><em class="fa fa-chevron-circle-right">&nbsp;&nbsp;</em> Подкатегория 3</a></li>
</ul>
</li>


<li><strong class="categories-item"><a><em class="fa fa-chevron-circle-right">&nbsp;&nbsp;</em> Категория 2 </a></strong>
<ul class="liste-produits">
<li><a href="/категория2/подкатегория1.html" class="produit-item"><em class="fa fa-chevron-circle-right">&nbsp;&nbsp;</em> Подкатегория 1</a></li>
<li><a href="/категория2/подкатегория2.html" class="produit-item"><em class="fa fa-chevron-circle-right">&nbsp;&nbsp;</em> Подкатегория 2</a></li>
<li><a href="/категория2/подкатегория3.html" class="produit-item"><em class="fa fa-chevron-circle-right">&nbsp;&nbsp;</em> Подкатегория 3</a></li>
</ul>
</li>


<li><strong class="categories-item"><a><em class="fa fa-chevron-circle-right">&nbsp;&nbsp;</em> Категория 1 </a></strong>
<ul class="liste-produits">
<li><a href="/категория3/подкатегория1.html" class="produit-item"><em class="fa fa-chevron-circle-right">&nbsp;&nbsp;</em> Подкатегория 1</a></li>
<li><a href="/категория3/подкатегория2.html" class="produit-item"><em class="fa fa-chevron-circle-right">&nbsp;&nbsp;</em> Подкатегория 2</a></li>
<li><a href="/категория3/подкатегория3.html" class="produit-item"><em class="fa fa-chevron-circle-right">&nbsp;&nbsp;</em> Подкатегория 3</a></li>
</ul>
</li>


</ul>
</nav>


JS самого меню:
function menu_js() {     
		if(menu_ul.length > 0){
		    menu_ul.hide();
		    menu_a.click(function(e) {
		        e.preventDefault();
		        if(!$(this).hasClass('active')) {
		            menu_a.removeClass('active');
		            menu_ul.filter(':visible').slideUp('normal');
		            $(this).addClass('active').next().stop(true,true).slideDown('normal');
		        } else {
		            $(this).removeClass('active');
		            $(this).next().stop(true,true).slideUp('normal');
		        }
		    });

		    if (menu_current.length > 0){
		    	if( menu_current.parent().attr('id') != "menu_mob" ){
			    	menu_current.parent().show();
			    	menu_current.parent().parent().addClass('activeLi');
		    	}else{
		    		menu_current.addClass('activeLi');
		    	}
		    }
		}
	}

		var menu_ul = $('#main .liste-produits'),
	        menu_a  = $('#main .categories-item'),
	        menu_current = $('#main .current'),
	        menu_ul_first = $('#main .liste-categories li:first-child .liste-produits'),
	        menu_parent_open = $('#main .liste-categories li:first-child .categories-item');

	        menu_js();


А этим я просто добавляю цвет пункту в меню на текущую страницу:
$(document).ready(function () {
        var url = window.location;
        var element = $('ul.liste-produits a').filter(function () {
            return this.href == url || url.href.indexOf(this.href) == 0;
        });
        $(element).parentsUntil('ul.sidebar-menu', 'li').addClass('active');
    });
Ответить с цитированием