Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Помогите доделать меню (https://javascript.ru/forum/dom-window/8634-pomogite-dodelat-menyu.html)

Nikolay63 06.04.2010 12:06

Помогите доделать меню
 
Пожалуйста помогите! Я совсем новечёк в яве.

Раньше на моём сайте http://www.birdsmoscow.net.ru/ была простая менюшка, но в результате у меня сайт разросся до 50 и более страниц и каждую страницу вручную надоело редактировать. Нашёл простой ява скрипт.

вот его код на моём сайте, находится в отельном файле:
document.write('<li><a href="info.html">Присоединяйтесь</a></li>');
document.write('<li><a href="proekt.html">Проекты</a></li>');
document.write('<li><a href="participants.html">Участники</a></li>');
document.write('<li><a href="news.html">Новости программы</a></li>');
document.write('<li><a href="birds-news.html">Птичьи евроньюсы</a></li>');
document.write('<li><a href="books.html">Публикации</a></li>');
document.write('<li><a href="interesmesta.html">Интересные  места</a></li>');
document.write('<li><a href="photoreport_bittern.html">Фоторепортажи</a></li>');
document.write('<li><a href="trips_vinogradovo.html">Наши выезды</a></li>');
document.write('<li><a href="qualifier.html">On-line определители</a></li>');
document.write('<li><a href="delivery.html">Рассылка</a></li>');
document.write('<li><a href="region-partner.html">Регионы-партнёры</a></li>');
document.write('<li><a href="partner.html">Партнеры</a></li>');
document.write('<li><a href="contacts.html">Контакты</a></li>');


Всё работает замечательно, но нужно чтоб при переходе пользователем в раздел ссылка окрашивалась в зелёный цвет и становилась активной чтоб пользователь понимал в каком разделе он находится.

Как этого можно добиться из того что уже существует.

Буду очень благодарен.

Skipp 06.04.2010 13:19

Сделай для каждой ссылки свой id, и на каждой станице установи стиль по id к той ссылки которую открыли.

Nikolay63 06.04.2010 13:25

С id понятно, раньше так у меня и было, когда классическое меню стояло. Но я не пойму куда теперь вписывать этот id.
Сейчас код, где стоит меню, выглядит так:
<ul>
        <script language="JavaScript" src="menu.js" type="text/javascript"></script>
      </ul>

Skipp 06.04.2010 13:30

В файле измени.
Что-то вроде того...

document.write('<li><a id="menu1" href="info.html">Присоединяйтесь</a></li>');
document.write('<li><a id="menu2" href="proekt.html">Проекты</a></li>');
document.write('<li><a id="menu3" href="participants.html">Участники</a></li>');
document.write('<li><a id="menu4" href="news.html">Новости программы</a></li>');
document.write('<li><a id="menu5" href="birds-news.html">Птичьи евроньюсы</a></li>');
document.write('<li><a id="menu6" href="books.html">Публикации</a></li>');
document.write('<li><a id="menu7" href="interesmesta.html">Интересные  места</a></li>');
document.write('<li><a id="menu8" href="photoreport_bittern.html">Фоторепортажи</a></li>');
document.write('<li><a id="menu9" href="trips_vinogradovo.html">Наши выезды</a></li>');
document.write('<li><a id="menu10" href="qualifier.html">On-line определители</a></li>');
document.write('<li><a id="menu11" href="delivery.html">Рассылка</a></li>');
document.write('<li><a id="menu12" href="region-partner.html">Регионы-партнёры</a></li>');
document.write('<li><a id="menu13" href="partner.html">Партнеры</a></li>');
document.write('<li><a id="menu14" href="contacts.html">Контакты</a></li>');

Gozar 06.04.2010 13:52

Nikolay63,
сделайте id и href одинаковыми, а дальше простенький скрипт который запускается после отображения меню
var id = document.location.href;
document.getElementById(id).style.backgroundColor = '#00ff00';

Nikolay63 06.04.2010 14:30

Gozar а можешь подробней объяснит. Я чувствую твой вариант правильнее, но не могу понять что куда писать.

Еще раз напишу что у меня есть.

Вот страница, например раздел присоединяйтесь http://www.birdsmoscow.net.ru/info.html

на ней установлен этот отсылающий на отдельный файл явы код:
<ul>
        <script language="JavaScript" src="menu.js" type="text/javascript"></script>
      </ul>


мне нужно чтоб ссылка присоединяйтесь горела зелёным и человек понимал что он находится в данный момент в этом разделе.

Отдельный файл явы "menu.js" содержит это:
document.write('<li><a href="info.html">Присоединяйтесь</a></li>');
document.write('<li><a href="proekt.html">Проекты</a></li>');
document.write('<li><a href="participants.html">Участники</a></li>');
document.write('<li><a href="news.html">Новости программы</a></li>');
document.write('<li><a href="birds-news.html">Птичьи евроньюсы</a></li>');
document.write('<li><a href="books.html">Публикации</a></li>');
document.write('<li><a href="interesmesta.html">Интересные  места</a></li>');
document.write('<li><a href="photoreport_bittern.html">Фоторепортажи</a></li>');
document.write('<li><a href="trips_vinogradovo.html">Наши выезды</a></li>');
document.write('<li><a href="qualifier.html">On-line определители</a></li>');
document.write('<li><a href="delivery.html">Рассылка</a></li>');
document.write('<li><a href="region-partner.html">Регионы-партнёры</a></li>');
document.write('<li><a href="partner.html">Партнеры</a></li>');
document.write('<li><a href="contacts.html">Контакты</a></li>');


что и куда вставлять я не совсем понимаю, и почему href должен быть одинаковый, это же ссылки на страницы, они же разные пути имеют.

Skipp 06.04.2010 14:59

Вставь всё в файл.
А точнее замени.

document.write('<li><a id="info" href="info.html">Присоединяйтесь</a></li>');
document.write('<li><a id="proekt" href="proekt.html">Проекты</a></li>');
document.write('<li><a id="participants" href="participants.html">Участники</a></li>');
document.write('<li><a id="news" href="news.html">Новости программы</a></li>');
document.write('<li><a id="birds" href="birds-news.html">Птичьи евроньюсы</a></li>');
document.write('<li><a id="books" href="books.html">Публикации</a></li>');
document.write('<li><a id="interesmesta" href="interesmesta.html">Интересные  места</a></li>');
document.write('<li><a id="photoreport" href="photoreport_bittern.html">Фоторепортажи</a></li>');
document.write('<li><a id="trips" href="trips_vinogradovo.html">Наши выезды</a></li>');
document.write('<li><a id="qualifier" href="qualifier.html">On-line определители</a></li>');
document.write('<li><a id="delivery" href="delivery.html">Рассылка</a></li>');
document.write('<li><a id="region" href="region-partner.html">Регионы-партнёры</a></li>');
document.write('<li><a id="partner" href="partner.html">Партнеры</a></li>');
document.write('<li><a id="contacts" href="contacts.html">Контакты</a></li>');

var loc = document.location.href;
loc = loc.split("/")[3].split(".")[0].split("-")[0].split("_")[0];
document.getElementById(loc).style.backgroundColor = '#00ff00';

Nikolay63 06.04.2010 15:26

Всё загрузил, но без изменений, ничего не происходит.

Skipp 06.04.2010 15:30

Не вижу на сайте изменений в коде. Подожди.

Nikolay63 06.04.2010 15:35

Большое спасибо! Единственное хотелось чтоб шрифт выделялся зелёным цветом, как раньше у меня было. Но поиграв с цветами и так можно оставить


Часовой пояс GMT +3, время: 23:59.