Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 24.03.2016, 12:28
Новичок на форуме
Отправить личное сообщение для SEMEon85 Посмотреть профиль Найти все сообщения от SEMEon85
 
Регистрация: 11.09.2015
Сообщений: 4

Вкладки (Табы) с запоминанием
Доброе время суток, уважаемые программисты.
Вопрос такой после перезагрузки страницы нужно чтобы вкладка была активной, так у которой внутри совпадает ссылка с адресом
т.е. если у дочернего элемента есть класс here то класс у родителя будет current

<div class="nav">
<ul class="gnav">
  <li><a href="#" title="tab1">75 лет начала ВОВ</a></li>
  <li><a href="#" title="tab2">О городе</a></li>
</ul>
 
<div class="subnav">
  <div id="tab1">
     <ul>
       <li><a href="/node/301">Земляки в боях за Родину</a></li>
       <li><a href="/book-exhibitions">Книжные выставки</a></li>
      </ul>
   </div>
 
  <div id="tab2">
      <ul>
       <li><a href="/node/254">Краевое исследование «Книга как память о войне»</a></li>
       <li><a href="/node/260">Методическая копилка</a></li>
      </ul>
  </div>
</div>
</div>


(function($) {
$(document).ready(function() {
//Вкладки  ( это нужно если нет совпадений с ссылками
 $(".subnav div").hide(); // Скрываем содержание
 $(".gnav li:first").attr("id","current"); // Активируем первую закладку
 $(".subnav div:first").fadeIn(); // Выводим содержание
//   
  $('.gnav a').click(function(e) {
  e.preventDefault();  
  $(".subnav div").hide(); //Скрыть все содержание
  $(".gnav li").attr("id",""); //Сброс ID
  $(this).parent().attr("id","current"); // Активируем закладку
  $('#' + $(this).attr('title')).fadeIn(); // Выводим содержание текущей закладки
  });
 
//класс дочерней ссылки если совпадает адрес и ссылка  
$('.subnav a').each(function () { // проходим по нужным нам ссылками
var location = window.location.href; // переменная с адресом страницы
var link = this.href; // переменная с url ссылки
var result = location.match(link); // результат возвращает объект если совпадение найдено и null при обратном
 
if(result != null) { // если НЕ равно null
$('.subnav a:first').removeClass('here'); // сначала удаляем класс с индексной страницы
$(this).addClass('here'); // добавляем класс
}
});
   
})();
 } ) (jQuery);


примерно так


Может кто поможет???

Последний раз редактировалось SEMEon85, 24.03.2016 в 15:22.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Эффектные вкладки табы - Tabulous.js (div и а хватает все) runyugin Элементы интерфейса 37 03.11.2016 01:06
Динамические Табы и drag&drop Surlik jQuery 3 16.11.2013 00:53
Как заставить работать вкладки внутри вкладок Vlasenko Fedor Общие вопросы Javascript 3 10.10.2013 16:14
Динамические вкладки Tmin10 jQuery 2 07.03.2012 10:48
IE, как сохранить вкладки Fly_ Internet Explorer 6 03.05.2010 16:00