Как развернуть определённый пункт меню, когда я перехожу по нему?

Question

[del993788]

Здравствуйте. Посмотрите пожалуйста на код https://jsfiddle.net/o2m56z7m/2/ . Подскажите, как сделать, чтобы при переходе по ссылке основной категории или дочернего пункта меню, разворачивался этот список.

Поподробнее: К примеру, есть пункт меню "Косметика для глаз". У него есть две функции:
1) Если нажать на блок, то покажутся его дочерние категории, т.е. "тушь" и "обводка"
2) Если нажать на само слово "Косметика для глаз", то мы перейдём по ссылке /gl .
Подскажите, как сделать, чтобы на странице /gl, странице "тушь" и "обводка" автоматически разворачивался пункт меню "Косметика для глаз"

Answer 1

[Алексей A]

Можете использовать Location hash. Для этого добавляем к нужным блокам id а в ссылки добавляем в конце хэши. Пример:

<li class="sub-cat">
    <a href="/gl#gl" class="a-cat">Косметика для глаз</a>
    <ul class="sub-nav" id="gl">
    <li class="in-sub-nav"><a href="#">Тушь</a></li>
    <li class="in-sub-nav"><a href="#">Обводка</a></li>
    </ul>
  </li>

Далее, в CSS добавляем

.sub-nav:target {
  display: block;
}

Читаем подробнее про :target
P. S. Не поддерживается IE <= 8

Результат посмотреть не получится нормально (так, как нельзя перейти на другую страницу), но хотя бы суть уловить можно jsfiddle

Comments

[del993788]

А смысл js кода, который вы добавили? И без него всё работает.

[Алексей A]

qqignatqq: Это что бы страница не прыгала, когда нажимаем на ссылку (автоматически скролится наверх блок с нужным id). Если у вас всё работает, то проблем нет :)

Answer 2

[Виталий]

В зависимости от URL присваивать класс active, который будет отображать раскрытое меню

Comments

[del993788]

за счёт чего? php? js? для каждого из блоков if прописывать?

[Виталий]

qqignatqq:
Можно на JQuary
if($('#someID').is("a[href^='pageX.html']")) {
$('.selector').addClass( "selected" ); // в зависимости от значения конца ссылки добавляется касс select
}
Можно на PHP
if ($_SERVER['REQUEST_URI']/pageX.html){
echo ('');
}