Question

На странице mmo-obzor.ru/mmorpg пытаюсь реализовать подстветку активной ссылки, но ничего не хочет работать:

HTML:

<div id="submenu"><ul>
<li><a href="/games">Все</a></li>
<li><a href="/mmorpg">MMORPG</a></li>
<li><a href="/moba">MOBA</a></li>
</ul></div> 

 

CSS:

#submenu {background-color:#fff;position:relative;margin-bottom:17px;padding:15px 30px;border:1px solid #E9E6E2;display:block}
#submenu ul li {display:inline-block;margin:2px 0}
#submenu ul li a {text-decoration:none;color:#444;display:block;padding:5px 10px;background-color:#eee;border-radius:4px;font:14px Verdana,sans-serif;}
#submenu ul li a:hover {color:red;background-color:#e4e4e4}
#submenu ul li a:active {text-decoration:none;background-color:#444;color:#fff}
.active a {text-decoration:none;background-color:#444;color:#fff}

 

Javascript:

<script> $(document).ready(function(){
var url=document.location.href; $.each($("#submenu"),function(){
if(this.href==url){$(this).addClass('active');};
});
});
</script> 

Пытался уже по-всякому менять классы, вариации скрипта, его позицию в коде страницы. Помогите, пожалуйста!

 

Answer 1

Посмотрите пример решения в материале https://www.ucoz.ru/qa/index.php/69612 . В вашем случае так же можно сделать на условных операторах.