Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   Подсветка активной ссылки (https://javascript.ru/forum/events/22535-podsvetka-aktivnojj-ssylki.html)

r12 24.10.2011 05:25

Подсветка активной ссылки
 
Содержания файла header.php оп адресу
http://---.ru/header.php


<script> 
onload = function () 
{ 
for (var lnk = document.links, j = 0; j < lnk.length; j++) 
if (lnk [j].href == document.URL) lnk [j].style.color = '#fff';
} 
</script>


<a href="http://---.ru">Главная</a>
<a href="http://2.---.ru">Карта</a>
<a href="http://3.---.ru">Новости</a>



Во всех субдоменах header.php включен в index.php
<?php
include("../header.php");
?>


:help:

Проблема заключается в том что:

если совершить переход на НОВОСТИ то подсветка будет на ссылке
<a href="http://3.---.ru">Новости</a>

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

Задача такова:

Сохранить подсветку ссылки
<a href="http://3.---.ru">Новости</a>

и при этом чтобы работала подсветка выбранного меню в Новостях
Пример:
<a href="http://3.---.ru/all">Все Новости</a>


Либо предложите вариант как все это можно реализовать иначе, в javascript я очень слаб. Задача оставить один header на все субдомены и в дальнейшем привязать уведомления в него..

ksa 24.10.2011 09:13

Цитата:

Сообщение от r12
предложите вариант как все это можно реализовать иначе

Я х/з как там у тебя реализованы странички... Но анализировать все (!) линки это ущербный подход. У тебя серверного языка совсем нет?

Для подсветки пунктов меню лучше использовать class, а не в style напрямую писать...

r12 24.10.2011 15:31

использовать class в примере:

<a href="http://..">Ссылка №1</a>
<a class="under" href="http://..">Ссылка №2</a>
<a href="http://..">Ссылка №3</a>


<a href="http://..">Ссылка №1</a>
<li><a href="http://..">Ссылка №2</a></li>
<a href="http://..">Ссылка №3</a>


тогда и class "under" и <li> можно использовать для подсветки, а как тогда подсветить активную ссылку не использую javascript для определения местонахождения?

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

Либо, пожалуйста, подскажите как в
<script> 
onload = function () 
{ 
for (var lnk = document.links, j = 0; j < lnk.length; j++) 
if (lnk [j].href == document.URL) lnk [j].style.color = '#fff';
} 
</script>

Добавить подчеркивание в виде {border-top: 1px #444;} к ссылке которая уже работает для подсветки

ksa 24.10.2011 15:38

Цитата:

Сообщение от r12
а как тогда подсветить активную ссылку не использую javascript для определения местонахождения?

Я так и не узнал как у тебя организованы страницы...

Например "местонахождение" точно знает серверный скрипт...

r12 24.10.2011 16:17

infinite.com.ua
/index.php [сюда подгружаем header]
/header.php
/style.css

card.infinite.com.ua
/index.php [сюда подгружаем header и style.css]
/client.php [сюда подгружаем header и style.css]

меню в header подсвечивается в Infinite и в Карта, все остальные реализованы с помощью классов хотелось бы добиться так как выглядит на http://news.infinite.com.ua/ только с помощью
<script> 
onload = function () 
{ 
for (var lnk = document.links, j = 0; j < lnk.length; j++) 
if (lnk [j].href == document.URL) lnk [j].style.color = '#fff';
} 
</script>

ksa 24.10.2011 16:28

При таком раскладе я бы вообще js не использовал... Сразу формировал страницы как нужно серверным скриптом.

r12 24.10.2011 17:51

а по javascript можешь подсказать? а то с ним нет времени вычитывать, как вставить border-top уже в существующий скрипт

ksa 24.10.2011 18:40

Цитата:

Сообщение от r12
как вставить border-top

Так прямо и вставляй...
Цитата:

Объектная модель
[window.]document.getElementById("elementID").style.borderTop

http://htmlbook.ru/css/border-top


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