Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 08.03.2014, 09:24
Аватар для belka_bk
Новичок на форуме
Отправить личное сообщение для belka_bk Посмотреть профиль Найти все сообщения от belka_bk
 
Регистрация: 08.03.2014
Сообщений: 3

Сделать меню активным для определнных ссылок
Всем привет, я не когда не встречалась с js и мне очень сложно разобраться одной, читала многие темы на форуме но 1в1 как у меня вопроса я не нашла, были похожие но там другой код, а так как я 0 в js, я даже переделать не смогла =(
Описание того что я хочу сделать:

Url Браузера: site.ru/index.php?id=linkd

<!-- sidebar -->
            <div class="span2 magic-menu-sidebar">
                <div class="hidden-phone hidden-tablet">
                    <h3>My title</h3>
                    <ul>
                        <li><a href="index.php?id=linka">Link A</a></li>
                        <li><a href="index.php?id=linkb">Link B</a></li>
                        <li><a href="index.php?id=linkc">Link C</a></li>
                        <li><a class="current" href="index.php?id=linkd">Link D</a></li>
                    </ul>
                </div>
            </div>
<!-- /sidebar -->


Как сделать именно через js, чтобы когда я была на странице
site.ru/index.php?id=linkx
а так же
site.ru/index.php?id=linkz
site.ru/index.php?id=linky
site.ru/index.php?id=linko
site.ru/index.php?id=linkp
site.ru/index.php?id=linkm
(только вот эти ссылки linkx,linkz,linky,linko,linkp,linkm ссылки не будут меняться динамически всегда будут с такими именами)
чтобы в меню Link D оставался "current"
<li><a class="current" href="index.php?id=linkd">Link D</a></li>

потому что если я ухожу с link D меню перестает быть "current".
<li><a href="index.php?id=linkd">Link D</a></li>

добавлять свои ссылки я не хочу в меню нужно чтобы их не было в меню но когда я на тех адресах сайта чтобы меню link D было current =)

Помогите пожалуйста
Ответить с цитированием
  #2 (permalink)  
Старый 08.03.2014, 10:02
Аватар для Zuenf
Кандидат Javascript-наук
Отправить личное сообщение для Zuenf Посмотреть профиль Найти все сообщения от Zuenf
 
Регистрация: 27.01.2012
Сообщений: 134

Вот так попробуй:
<!-- sidebar -->
            <div class="span2 magic-menu-sidebar">
                <div class="hidden-phone hidden-tablet">
                    <h3>My title</h3>
                    <ul>
                        <li><a href="index.php?id=linka">Link A</a></li>
                        <li><a href="index.php?id=linkb">Link B</a></li>
                        <li><a href="index.php?id=linkc">Link C</a></li>
                        <li><a class="current" href="index.php?id=linkd">Link D</a></li>
                    </ul>
                </div>
            </div>
<!-- /sidebar -->
<script>
if(location.search.match(/id=link[xzyopm]/)){
var linkd = document.querySelector('.magic-menu-sidebar a[href*=linkd]');
linkd.className = linkd.className + ' current';
}
</script>

Я думаю на сервере это логичней делать.
Ответить с цитированием
  #3 (permalink)  
Старый 08.03.2014, 10:44
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,126

Zuenf,
код должен срабатывать для всех ссылок а не только для одной
Возможно ли такое на javascript тут сборник на эту тему
belka_bk,
Сообщение от Zuenf
Я думаю на сервере это логичней делать.
Ответить с цитированием
  #4 (permalink)  
Старый 08.03.2014, 11:03
Аватар для Zuenf
Кандидат Javascript-наук
Отправить личное сообщение для Zuenf Посмотреть профиль Найти все сообщения от Zuenf
 
Регистрация: 27.01.2012
Сообщений: 134

Сообщение от рони
код должен срабатывать для всех ссылок а не только для одной
Не совсем понял, к чему это.
Я делал конкретно по "ТЗ"
Цитата:
потому что если я ухожу с link D меню перестает быть "current".
Т.е. какая-то обработка там уже есть, раз класс убирается.
И как я понял нужно было просто добавить несколько конкретных "id" при которых последняя ссылка будет активной.
А на счет смены класса активных ссылок средствами js ничего не говорилось. Я так понимаю там это уже реализовано на php.
Ответить с цитированием
  #5 (permalink)  
Старый 08.03.2014, 11:34
Аватар для belka_bk
Новичок на форуме
Отправить личное сообщение для belka_bk Посмотреть профиль Найти все сообщения от belka_bk
 
Регистрация: 08.03.2014
Сообщений: 3

Сообщение от Zuenf Посмотреть сообщение
Вот так попробуй:
<!-- sidebar -->
            <div class="span2 magic-menu-sidebar">
                <div class="hidden-phone hidden-tablet">
                    <h3>My title</h3>
                    <ul>
                        <li><a href="index.php?id=linka">Link A</a></li>
                        <li><a href="index.php?id=linkb">Link B</a></li>
                        <li><a href="index.php?id=linkc">Link C</a></li>
                        <li><a class="current" href="index.php?id=linkd">Link D</a></li>
                    </ul>
                </div>
            </div>
<!-- /sidebar -->
<script>
if(location.search.match(/id=link[xzyopm]/)){
var linkd = document.querySelector('.magic-menu-sidebar a[href*=linkd]');
linkd.className = linkd.className + ' current';
}
</script>

Я думаю на сервере это логичней делать.
Я тебя обожаю!!! =)
спасибо огромное !!! Немножко изменила.
Но даже без знаний js все отлично сработало, заменила просто линк на реальные ссылки =)


А еще хотела узнать это будет нормально работать в любом браузере? разумеется если у человека не заблокирован js.

Последний раз редактировалось belka_bk, 08.03.2014 в 11:37. Причина: добавление вопроса
Ответить с цитированием
  #6 (permalink)  
Старый 08.03.2014, 11:47
Аватар для Zuenf
Кандидат Javascript-наук
Отправить личное сообщение для Zuenf Посмотреть профиль Найти все сообщения от Zuenf
 
Регистрация: 27.01.2012
Сообщений: 134

Да, это вполне кроссбраузерный вариант.
Ответить с цитированием
  #7 (permalink)  
Старый 08.03.2014, 11:52
Аватар для belka_bk
Новичок на форуме
Отправить личное сообщение для belka_bk Посмотреть профиль Найти все сообщения от belka_bk
 
Регистрация: 08.03.2014
Сообщений: 3

Сообщение от Zuenf Посмотреть сообщение
Да, это вполне кроссбраузерный вариант.
Очень рада, спасибо большое еще раз
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Ищу jQuery плагин для создания меню Zeboton jQuery 9 15.09.2014 15:31
Как сделать меню сразу отурытым. vdiapazone Events/DOM/Window 0 22.11.2011 12:24
Подскажите как сделать меню на CSS если: greatilya (X)HTML/CSS 10 18.10.2009 20:26
Как сделать функцию типа toDataUrl для рисунка в ie6 ? Олег Общие вопросы Javascript 2 14.09.2008 00:06
Помогите сделать простое меню debugger Элементы интерфейса 1 09.09.2008 23:14