Активаня ссылка в меню CSS

lordenas
На сайте с 09.05.2009
Offline
67
626

Здравствуйте. Подскажите, как выделить ссылку на которой непосредственно в данный момент находится пользователь.

есть код

ul.menu li:active {

background: linear-gradient(to top, #450000, #890000);
padding: 10px;
}

ul.menu li:hover {
background: linear-gradient(to top, #450000, #890000);
padding: 10px;
}
R
На сайте с 18.12.2009
Offline
92
#1

Подробнее опишите задачу. Пользователь находится на ссылке?

lordenas
На сайте с 09.05.2009
Offline
67
#2

Есть вот такое вот меню.

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

R
На сайте с 18.12.2009
Offline
92
#3

Пользователь находится не на ссылке, а на странице.

На ссылке же может находится курсор мыши. Отсюда следует вопрос.

Вам необходимо выделить ссылку при наведении курсора, т.е. по событию hover, или же выделить ссылку, когда пользователь находится на странице? В таком случае для ссылки или для элемента li можно задать некий класс. Что Вам необходимо?

lordenas
На сайте с 09.05.2009
Offline
67
#4

выделить ссылку, когда пользователь находится на странице

twinlv
На сайте с 11.12.2013
Offline
65
#5

Пиши проверку,

создай клас к примеру .active (такой-же как hover)

если ссылка = то что в твоем меню то добовляй .active

lordenas:
выделить ссылку, когда пользователь находится на странице
CloudHosting.lv - полный комплекс услуг на базе собственного ДЦ (г. Рига, Латвия) https://www.cloudhosting.lv (https://www.cloudhosting.lv)
lordenas
На сайте с 09.05.2009
Offline
67
#6

а как это в CSS реализовать?

twinlv
На сайте с 11.12.2013
Offline
65
#7

Никак, как твой CSS узнает на кокой странице находишься ?

lordenas:
а как это в CSS реализовать?
[Удален]
#8

лучше всего через php добавить класс активной ссылке но если сайт только на html то можно и js

<script type="text/javascript">
try{
var el=document.getElementById('id блока в котором будем искать активную ссылку').getElementsByTagName('a');
var url=document.location.href;
for(var i=0;i<el.length; i++){
if (url==el.href){
el.className += ' active';
};
};
}catch(e){}
</script>

скрипт будет искать и сравнивать все a в вашем блоке и сравнивать с текущим url. если ссылка найдена то ей добавляется класс "active". осталось задать ему стиль

lordenas
На сайте с 09.05.2009
Offline
67
#9

WPro, спасибо тебе, получилось:)

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий