2

Как сделать выделение активного (нажатого) раздела/ссылки в меню?
Какой нужно добавить JS из Bootstrap и что нужно добавить в само меню?

Код:

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" />

<ul class="nav nav-pills">
  <li class="active"><a href="#">Home</a></li>
  <li><a href="#">Profile</a></li>
  <li><a href="#">Messages</a></li>
</ul>

Пример меню: changeip.ru

1
  • Выделение происходит за счёт добавления класса "active", но сам по себе этот класс бутстрап не добавляет. Это уже вы должны на стороне движка/сервера добавлять класс элементу меню, соответствующему текущей странице. По клику добавляется класс например "open", но он для выпадающий dropdown list. Commented 11 сент. 2013 в 10:02

1 ответ 1

1

Чтобы переместить класс Актив на другой элемент, Вам нужно написать примерно такой код на JavaScript:

$(function($){

var location = window.location.toString();

switch(location ){

    case "/home": 
        $('.НазваниеКлассаВашегоМеню li).removeClass('active');
        $('.НазваниеКлассаВашегоМеню li[href="/home"]').addClass('active'); brake;

    case "/page1": 
        $('.НазваниеКлассаВашегоМеню li).removeClass('active');
        $('.НазваниеКлассаВашегоМеню li[href="/page1"]').addClass('active'); brake;
    ....

    }
});

Ваш ответ

Нажимая «Отправить ответ», вы соглашаетесь с условиями пользования и подтверждаете, что прочитали политику конфиденциальности.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.