Подсветка активного пункта меню на jQuery

Довольно часто встаёт проблема подсветки активного пункта в меню.
Проблема решается одной строчкой кода)

HTML:

<ul class="navigation">
    <li><a href="/">Далеко-далеко за словесными.</a></li>
    <li><a href="/news/">Обеспечивает, текста, о.</a></li>
    <li><a href="/111/">Подзаголовок, они там!</a></li>
    <li><a href="/222/">Вершину, моей, алфавит.</a></li>
    <li><a href="/333/">Злых, предложения, по всей.</a></li>
</ul>

jQuery

jQuery(document).ready(function($) {
    $('.navigation a[href^="/' + location.pathname.split("/")[1] + '"]').addClass('active');
});

Теперь при переходе к примеру на страницу /news/ к соответствующей ссылке будет добавлен класс active

Источник:dle-faq.pro, DLE

Перейти на сайт

Подсветка активного пункта меню на jQuery

Похожие новости