Форум программистов, компьютерный форум, киберфорум
jQuery
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск Заказать работу  
 
Рейтинг 4.91/11: Рейтинг темы: голосов - 11, средняя оценка - 4.91
122 / 65 / 4
Регистрация: 12.04.2009
Сообщений: 1,047

Активный пункт меню

04.01.2013, 22:11. Показов 2074. Ответов 6
Метки нет (Все метки)

Студворк — интернет-сервис помощи студентам
сделал табличку, в каждую яцейку поместил пункт меню придал им стил. задача при клике по пукту он меняет свой цвет, это я тоже понимаю как сделатьно если кликают по второму пункту то предидущий должен вернутся в первоночалному цвету. как это делается! при каждом улике писать приобразования для каждого дркгого пункта? или можно по ним как нибуть в цикле проитись??
0
IT_Exp
Эксперт
34794 / 4073 / 2104
Регистрация: 17.06.2006
Сообщений: 32,602
Блог
04.01.2013, 22:11
Ответы с готовыми решениями:

Выделить активный пункт меню
Доброго времени суток! Я видела, что похожие темы были, но я в ступоре(( Надо закончить меню для заказчика, и остался последний штрих.......

Как выделить активный пункт меню на JQuery
Добрый день! Не работает скрипт, изменяющий цвет активного пункта меню. Есть меню (стандартный цвет черный). При клике по...

Как сделать так, чтобы после нажатия на пункт меню страница прокручивалась до якоря и меню закрывалось?
Привет всем, у меня есть html код страницы со вставками javascript кода. Имеется два javascripta, один отвечает за прокрутку страницы к...

6
 Аватар для Soldado
901 / 833 / 198
Регистрация: 28.06.2012
Сообщений: 1,607
Записей в блоге: 4
04.01.2013, 22:39
По клику - всем ячейкам таблицы (id="mytable") присваивайте цвет фона такой какой задан в стилях изначально, а для кликнутой ccылки (this) находим ячейку и ей задаём новый цвет.

JavaScript
1
2
3
4
5
6
7
8
9
<script type="text/javascript">
$(document).ready(function(){
 $("#mytable  a").click(function(){
  $("#mytable td").css("background-color","#eaf57c");
  $(this).parent("td").css("background-color","#23c750");     
             });
                     
 });/*end  ready*/
 </script>
демонстрация
0
супермизантроп
Эксперт JS
3941 / 2979 / 692
Регистрация: 18.04.2012
Сообщений: 8,629
05.01.2013, 05:01
1. вводится глобальная переменная, изначально неопределённая
2. в эту глобальную переменную будет заноситься ссылка на текущий активный объект-ячейку
3. функция для события клика назначается одна, на тег <table>
4. через объект event определяется новая активная ячейка, по которой кликнули
5. если текущая ячейка != сохранённой в глобальном объекте, то предыдущей активной ячейке стиль меняется на исходный, а новая ячейка выделяется и заносится в глобальную переменную

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<table border="1" cellpadding="5" onclick="myFunc (event)">
<tr><td>00</td><td>01</td><td>02</td></tr>
<tr><td>10</td><td>11</td><td>12</td></tr>
<tr><td>20</td><td>21</td><td>22</td></tr>
</table>
 
<script>
var myGlob;
function myFunc (ev)
{
var e = window.event || ev, obj = e.srcElement || e.target;
if (obj.tagName != 'TD') return;
if (myGlob != obj) if (myGlob) myGlob.style.backgroundColor = '';
myGlob = obj; myGlob.style.backgroundColor = 'red';
}
</script>
0
122 / 65 / 4
Регистрация: 12.04.2009
Сообщений: 1,047
05.01.2013, 14:53  [ТС]
Написал:

HTML5
1
2
3
4
5
6
7
8
9
<div class="menu">
        <table class="menuTable">
        <tr><td><a href="#">Недвижимость</a></td></tr>
        <tr><td><a href="#">Торгогвля</td></a></tr>
        <tr><td><a href="#">Специалисты</td></a></tr>
        <tr><td><a href="#">Ремонтные работы</a></td></tr>
        <tr><td><a href="#">Отдых и Развлечения</a></td></tr>
        </table>
     </div>
JavaScript
1
2
3
4
5
6
7
$(document).ready(function(e)
 {
    $(".menuTable  a").click(function(){
          $(".menuTable td").css("color","#BBEA0D");
          $(this).parent("td").css("color","#4A000B");     
      });
 })
но не работает почемуто!?
0
 Аватар для ozTomas12
3 / 3 / 1
Регистрация: 08.11.2012
Сообщений: 12
05.01.2013, 15:02
Вы не правильно цвет ставите. Цвет нужно менять не у элемента <td>, а у ссылки <a>. Вот код:
JavaScript
1
2
3
4
5
6
7
$(document).ready(function(e)
 {
    $(".menuTable a").click(function(){
          $(".menuTable a").css("color","#BBEA0D");
          $(this).css("color","#4A000B");     
      });
 })
1
122 / 65 / 4
Регистрация: 12.04.2009
Сообщений: 1,047
05.01.2013, 16:19  [ТС]
спасибо! помогло!

А вот если у меня есть такя табличка:

HTML5
1
2
3
4
5
<div class="geographic">
        <table class="geografic_table"><tr><td><a>Север</a></td><td><a>Хайфа</a></td><td><a>Центр</a></td>
        <td><a>а-Шарон</a></td><td><a>Гуш-дан</a></td><td><a>Иерусалим</a></td><td><a>а-Шфела</a></td>
        <td><a>Юг</a></td></tr></table> 
</div>
То есть табличка горизонтальная а не вертикальная! как надо скриптик поправить, менял просто имена классов - непомогло!!

Добавлено через 2 минуты
Вопрос снимается - разобрался!!!
0
0 / 0 / 0
Регистрация: 28.01.2014
Сообщений: 13
13.03.2014, 18:24
А этот скриптик, можно как-то прикрутить к блочному меню? Или только к с таблицей прокатывает?
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
BasicMan
Эксперт
29316 / 5623 / 2384
Регистрация: 17.02.2009
Сообщений: 30,364
Блог
13.03.2014, 18:24
Помогаю со студенческими работами здесь

Плавающий активный элемент в меню
Подскажите, где можно взять информацию. Либо же уже готовый код. Заранее, спасибо большое.

Ловим активный select и ставим, что он активный
есть select с двумя option.Задание - нужно сделать так чтобы по нажатию на один option с &quot;ближайшее время &quot;не чего не...

Выделить выбранный пункт меню
Всем привет! Есть код. &lt;div id=&quot;navouter&quot;&gt; &lt;div id=&quot;nav&quot;&gt; &lt;ul class=&quot;lavalamp&quot; id=&quot;menu1&quot;&gt; &lt;li class=&quot;page_item...

Оставить пункт выделенным,пока мы находимся в выпадающем меню
Нашел на просторах интернета скрипт и успешно его применил &lt;script&gt; $(document).ready(function(){ ...

Нужно выделить пункт меню, на странице которого пользователь находится в данный момент
Добрый день, CSS и HTML более менее выучила, а в JS пока нет желания лезть, вот ищу готовые решения jQuery, но еще до конца не понимаю что...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
7
Ответ Создать тему
Новые блоги и статьи
PhpStorm 2025.3: WSL Terminal всегда стартует в ~
and_y87 14.12.2025
PhpStorm 2025. 3: WSL Terminal всегда стартует в ~ (home), игнорируя директорию проекта Симптом: После обновления до PhpStorm 2025. 3 встроенный терминал WSL открывается в домашней директории. . .
Access
VikBal 11.12.2025
Помогите пожалуйста !! Как объединить 2 одинаковые БД Access с разными данными.
Новый ноутбук
volvo 07.12.2025
Всем привет. По скидке в "черную пятницу" взял себе новый ноутбук Lenovo ThinkBook 16 G7 на Амазоне: Ryzen 5 7533HS 64 Gb DDR5 1Tb NVMe 16" Full HD Display Win11 Pro
Музыка, написанная Искусственным Интеллектом
volvo 04.12.2025
Всем привет. Некоторое время назад меня заинтересовало, что уже умеет ИИ в плане написания музыки для песен, и, собственно, исполнения этих самых песен. Стихов у нас много, уже вышли 4 книги, еще 3. . .
От async/await к виртуальным потокам в Python
IndentationError 23.11.2025
Армин Ронахер поставил под сомнение async/ await. Создатель Flask заявляет: цветные функции - провал, виртуальные потоки - решение. Не threading-динозавры, а новое поколение лёгких потоков. Откат?. . .
Поиск "дружественных имён" СОМ портов
Argus19 22.11.2025
Поиск "дружественных имён" СОМ портов На странице: https:/ / norseev. ru/ 2018/ 01/ 04/ comportlist_windows/ нашёл схожую тему. Там приведён код на С++, который показывает только имена СОМ портов, типа,. . .
Сколько Государство потратило денег на меня, обеспечивая инсулином.
Programma_Boinc 20.11.2025
Сколько Государство потратило денег на меня, обеспечивая инсулином. Вот решила сделать интересный приблизительный подсчет, сколько государство потратило на меня денег на покупку инсулинов. . . .
Ломающие изменения в C#.NStar Alpha
Etyuhibosecyu 20.11.2025
Уже можно не только тестировать, но и пользоваться C#. NStar - писать оконные приложения, содержащие надписи, кнопки, текстовые поля и даже изображения, например, моя игра "Три в ряд" написана на этом. . .
Мысли в слух
kumehtar 18.11.2025
Кстати, совсем недавно имел разговор на тему медитаций с людьми. И обнаружил, что они вообще не понимают что такое медитация и зачем она нужна. Самые базовые вещи. Для них это - когда просто люди. . .
Создание Single Page Application на фреймах
krapotkin 16.11.2025
Статья исключительно для начинающих. Подходы оригинальностью не блещут. В век Веб все очень привыкли к дизайну Single-Page-Application . Быстренько разберем подход "на фреймах". Мы делаем одну. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2025, CyberForum.ru