Правила     Закладки     Карма    Календарь    Журналы    Помощь    Поиск    PDA    Чат   
        СМС-ки
   
Пейджер выключен!
 
Фильтр авторов:    показать 
  скрыть
  Ответ в темуСоздание новой темыСоздание опроса

> Выделение активного пункта меню с помощью JS
Xander  
 ۩  Дата
Цитировать сообщение

Пользователя сейчас нет на форуме



Абориген
*****

Профиль
Группа: Форумчанин
Завсегдатай форума
Сообщений: 207
Пользователь №: 22316
На форуме: 6 лет, 6 месяцев, 17 дней
Карма: 0




Доброго времени суток!

          		<ul class="menu">
<li
class="top_menu_about"><a href="">о pdj</a></li>
<li
class="gal"><a href="">галерея</a></li>
<li
class="top_menu_tex"><a href="">техподдержка</a></li>
<li
class="top_menu_buy"><a href="">где купить</a></li>
<li
class="top_menu_kont"><a href="">контакты</a></li>
</ul>





каким образом мне можно добавить класс .active к li дабы выделить активный пункт меню!

PMПисьмо на e-mail пользователю
    0   Для быстрого поиска похожих сообщений выделите 1-2 слова в тексте и нажмите сюда Для быстрой цитаты из этого сообщения выделите текст и нажмите сюда
johniek_comp  
Дата
Цитировать сообщение

Пользователя сейчас нет на форуме



женат на Node.JS
******

Профиль
Группа: Форумчанин
Завсегдатай форума
Сообщений: 2478
Пользователь №: 28490
На форуме: 5 лет, 5 месяцев, 16 дней
Карма: -19

Трезвый :
21 год, 10 месяцев, 24 дня


вообще легко
<li class="top_menu_about active"><a href="">о pdj</a></li>


js
document.getElementsByTagName('li')[0].className = "active"


какой вопрос - такой ответ


--------------------
user posted image
PMПисьмо на e-mail пользователю
    0   Для быстрого поиска похожих сообщений выделите 1-2 слова в тексте и нажмите сюда Для быстрой цитаты из этого сообщения выделите текст и нажмите сюда
killer8080  
Дата
Цитировать сообщение

Пользователя сейчас нет на форуме



Здесь живет
******

Профиль
Группа: Эксперт
Группа переписки
Сообщений: 8737
Пользователь №: 26630
На форуме: 5 лет, 9 месяцев, 7 дней
Карма: 591




ну например так
          		<ul class="menu">
<
li><a href="">о pdj</a></li>
<
li><a href="">галерея</a></li>
<
li><a href="">техподдержка</a></li>
<
li><a href="">где купить</a></li>
<
li><a href="">контакты</a></li>
</
ul>

<
script type="text/javascript">

var links = document.getElementsByClassName('menu')[0].getElementsByTagName('a');
for(var i = 0; i < links.length; i++){
if(links[i].href == location.href)
links[i].parentNode.className = 'active';
}

</script>
PMПисьмо на e-mail пользователю
    0   Для быстрого поиска похожих сообщений выделите 1-2 слова в тексте и нажмите сюда Для быстрой цитаты из этого сообщения выделите текст и нажмите сюда
Xander  
 ۩  Дата
Цитировать сообщение

Пользователя сейчас нет на форуме



Абориген
*****

Профиль
Группа: Форумчанин
Завсегдатай форума
Сообщений: 207
Пользователь №: 22316
На форуме: 6 лет, 6 месяцев, 17 дней
Карма: 0




ни один вариант не работает он заменят мой класс на .active (
PMПисьмо на e-mail пользователю
    0   Для быстрого поиска похожих сообщений выделите 1-2 слова в тексте и нажмите сюда Для быстрой цитаты из этого сообщения выделите текст и нажмите сюда
Michael  
Дата
Цитировать сообщение

Пользователя сейчас нет на форуме



Здесь живет
******

Профиль
Группа: Эксперт
Группа переписки
Сообщений: 6065
Пользователь №: 18498
На форуме: 7 лет, 4 месяца, 12 дней
Карма: 256




Чтобы не заменяло, надо добавлять ;) .

links[i].parentNode.className = links[i].parentNode.className + ' active'; 


--------------------
There never was a struggle in the soul of a good man that was not hard
PM
    0   Для быстрого поиска похожих сообщений выделите 1-2 слова в тексте и нажмите сюда Для быстрой цитаты из этого сообщения выделите текст и нажмите сюда
killer8080  
Дата
Цитировать сообщение

Пользователя сейчас нет на форуме



Здесь живет
******

Профиль
Группа: Эксперт
Группа переписки
Сообщений: 8737
Пользователь №: 26630
На форуме: 5 лет, 9 месяцев, 7 дней
Карма: 591




Цитата (Xander @ 15.03.2013 - 06:54)
ни один вариант не работает он заменят мой класс на .active (

кстати, а для чего у тебя каждому li назначен свой класс? У тебя кадлый пункт имеет индивидуальный стиль? blink.gif



Спустя 8 минут, 12 секунд killer8080 написал(а):
var links = document.getElementsByClassName('menu')[0].getElementsByTagName('a'); 
for(var i = 0; i < links.length; i++){
if(links[i].href == location.href)
links[i].parentNode.className += ' active';
}
PMПисьмо на e-mail пользователю
    0   Для быстрого поиска похожих сообщений выделите 1-2 слова в тексте и нажмите сюда Для быстрой цитаты из этого сообщения выделите текст и нажмите сюда
Xander  
 ۩  Дата
Цитировать сообщение

Пользователя сейчас нет на форуме



Абориген
*****

Профиль
Группа: Форумчанин
Завсегдатай форума
Сообщений: 207
Пользователь №: 22316
На форуме: 6 лет, 6 месяцев, 17 дней
Карма: 0




да)
PMПисьмо на e-mail пользователю
    0   Для быстрого поиска похожих сообщений выделите 1-2 слова в тексте и нажмите сюда Для быстрой цитаты из этого сообщения выделите текст и нажмите сюда
Xander  
 ۩  Дата
Цитировать сообщение

Пользователя сейчас нет на форуме



Абориген
*****

Профиль
Группа: Форумчанин
Завсегдатай форума
Сообщений: 207
Пользователь №: 22316
На форуме: 6 лет, 6 месяцев, 17 дней
Карма: 0




всем спс за помощь) сделал)
PMПисьмо на e-mail пользователю
    0   Для быстрого поиска похожих сообщений выделите 1-2 слова в тексте и нажмите сюда Для быстрой цитаты из этого сообщения выделите текст и нажмите сюда
  Быстрый ответ
Информация о Госте
Введите Ваше имя
Кнопки кодов
Для вставки цитаты, выделите нужный текст и
НАЖМИТЕ СЮДА
Введите сообщение
Смайлики
:huh:  :o  ;) 
:P  :D  :lol: 
B)  :rolleyes:  <_< 
:)  :angry:  :( 
:unsure:  :blink:  :ph34r: 
     
Показать всё

Опции сообщения  Включить смайлики?
 Включить подпись?
 
1 Пользователей читают эту тему (1 Гостей и 0 Скрытых Пользователей)
0 Пользователей:

Опции темы Ответ в темуСоздание новой темыСоздание опроса