[ Поиск ] - [ Пользователи ] - [ Календарь ]
Полная Версия: Изменение фона ячейки таблицы
Страницы: 1, 2
segazav
Здравствуйте!

Есть обычная таблица, в ячейках таблицы находятся текстовые ссылки.
Подскажите, как можно сделать изменение фона ячейки с ссылкой, которая соответствует загруженной странице и сделать ссылку не активной.
Чтобы было визуально понятно, какая ячейка со ссылкой соответствует открытой странице.

Конечно на PHP это можно сделать, но нужно с помощью JS или jQuery и CSS.
Arh
Где то была похожая тема
попробуйте скрипт

$(function(){
$('nav a').each(function(){
url = String(document.location).split('//')[1];
href = $(this).attr('href');
pos = url.indexOf(href) +1;
if(pos) {
$(this).addClass('active');
}
}
);
});


смысл в том, что скрипт по идее находит ссылки в блоке <nav></nav> соответствующие ссылке из адресной строки и добавляет им класс active

_____________
Промокод предоставляет скидку на заказ домена и/или хостинга reg.ru
BFCC-3895-8804-9ED2
segazav
Спасибо, сейчас попробую!
А как же класс, который первоначально задан?
Arh
Цитата
А как же класс, который первоначально задан?

ну его можно удалить
$(this).removeClass('home');


_____________
Промокод предоставляет скидку на заказ домена и/или хостинга reg.ru
BFCC-3895-8804-9ED2
segazav
А как сделать ссылку не активной в этом случае?
Arh
segazav
В каком смысле не активной? Что бы на неё нельзя было нажать?

_____________
Промокод предоставляет скидку на заказ домена и/или хостинга reg.ru
BFCC-3895-8804-9ED2
segazav
Ну да и стиль ссылки изменить, т.к. она первоначально тоже имеет свой стиль (подчеркивание, цвет при наведении и пр.)

И почему то не удаляется первоначальный класс, а добавляется класс к ссылке, а не к ячейке таблицы

<script>
$(function(){
$('nav a').each(function(){
url = String(document.location).split('//')[1];
href = $(this).attr('href');
pos = url.indexOf(href) +1;
if(pos) {
$(this).removeClass('tabl_obyavl');
$(this).addClass('tabl_obyavl1');
}
}
);
});
</
script>



<nav><table width="100%" border="0" cellpadding="5" cellspacing="0">
<tr>
<td
align="center" valign="middle" class="tabl_obyavl"><a href="....php?razd=m" class="linc">Мобильные телефоны</a></td>
<td
align="center" valign="middle" class="tabl_obyavl"><a href="....php?razd=t" class="linc">Стационарные телефоны</a></td>
<td
align="center" valign="middle" class="tabl_obyavl"><a href="....php?razd=r" class="linc">Рации и радиостанции</a></td>
<td
align="center" valign="middle" class="tabl_obyavl"><a href="....php?razd=p" class="linc">Другое</a></td>
</tr>
</table></nav>

Быстрый ответ:

 Графические смайлики |  Показывать подпись
Здесь расположена полная версия этой страницы.
Invision Power Board © 2001-2024 Invision Power Services, Inc.