меню

Допустим нужно выделить текущий пункт меню отдельным стилем. Иногда, это сделать просто невозможно (в случае Ajax) или сложно из-за структуры меню и тут нам на помощь приходит JavaScript, а точнее jQuery:

Этот сниппет очень прост и заключается в том, что бы из полученного массива ссылок выбрать только ту, у которой атрибут href совпадает с адресом страницы.

  
$(function () {                 // Когда страница загрузится
  $('.lmenu a').each(function () {      // получаем все нужные нам ссылки
    var location = window.location.href;  // получаем адрес страницы
    var link = this.href;         // получаем адрес ссылки
    if(location == link) {          // при совпадении адреса ссылки и адреса окна
      $(this).addClass('active');     //добавляем класс
    }
  });
}); 
  

Нужно выделить и родителей ?

Если у вас древовидное меню, бывает, нужно выделить не только текущую ссылку но и ссылки родительских разделов, для этого используем метод Match(). Код будет таким:

  
$(function () {               // когда страница загружена
  $('.lmenu a').each(function () {    // проходим по нужным нам ссылками
    var location = window.location.href;// переменная с адресом страницы
    var link = this.href;       // переменная с url ссылки
    var result = location.match(link);  // результат возвращает объект если совпадение найдено и null при обратном

    if(result != null) {        // если НЕ равно null
      $(this).addClass('current');  // добавляем класс
    }
  });
});
  

Еще один способ

  
(function($){ 
  $(document).ready(function(){
    var pathname = window.location.pathname,
      page = pathname.split(/[/ ]+/).pop(),
      menuItems = $('#main_menu a');
    menuItems.each(function(){
      var mi = $(this),
        miHrefs = mi.attr("href"),
        miParents = mi.parents('li');
      if(page == miHrefs) {
        miParents.addClass("active").siblings().removeClass('active');
      }
    });
  });
})(jQuery);
  

Возможно, вам будет интересно

JavaScript and JQuery 1.8.3 решение проблемы с функцией attr() на примере генератора пароля

Совсем недавно решил написать генератор пароля с возможностью просмотра генерированного пароля под звездочками. Для работы выбрал JQuery 1.8.3 и нативный JavaScript. При написании самого скрипта столкнулся с проблемой в JQuery 1.8.3 с функцией attr().

Семь необходимых операторов RxJS

Как front-end разработчик вы знаете, что управление асинхронными данными - это не легкая задача. Иногда кажется, что нужна целая команда клоунов, чтобы держать все эти мячи в воздухе! Но в этом и заключается сила библиотеки RxJS. Она помогает легко манипулировать потоками асинхронных данных.

Вывод последнего дня текущего месяца на Javascript

Попалась интересная задачка, на баннере нужно было выводить «Акция действует до (тут последний день месяца)», решил сделать это на Javascript, ну чтоб не лазить каждый раз в код для правок, вот что получилось

Плавная кнопка "Наверх" на jQuery

Многие из Вас видели, что на некоторых сайтах при прокрутке окна браузера, в какой-то момент появляется кнопка "Наверх". Если по ней кликнуть, то начинается плавная промотка полосы прокрутки до самого верха. Как реализовать плавную кнопку "Наверх" через jQuery, Вы и узнаете из этой статьи.

Оформление заявки

Документы на создание сайта

Изучите наше коммерческое предложение, заполните БРИФ и отправьте его на почту maxidebox@list.ru. Изучив все пожелания из БРИФ-а, обратным ответом оповестим Вас по стоимости разработке, ответим на вопросы.

КП на создание сайта Коммерческое предложение на созданеи сайта

Мы берем на себя ответственность за все стадии работы и полностью избавляем клиентов от забот и необходимости вникать в тонкости.

Скачать БРИФ (акета) на создание сайта Скачать БРИФ (акета) на создание сайта

Зополните у БРИФ-а все необходимые поля. Сделайте краткое описание к каждому из пунктов анкеты, привидите примеры в соответсвующий пунктах - это позволит лучше понять Ваши ожидания и требования к сайту