Как подсветить какой пункт в меню выбран?
Обновлю вопрос, поскольку не нашел ответа.
Вот что мне надо! И прошу, не надо писать, что на каждой странице надо вручную переделывать меню.
Stack Overflow на русском — это сайт вопросов и ответов для программистов. Присоединяйтесь! Регистрация займёт не больше минуты.
Присоединиться к сообществуКак подсветить какой пункт в меню выбран?
Обновлю вопрос, поскольку не нашел ответа.
Вот что мне надо! И прошу, не надо писать, что на каждой странице надо вручную переделывать меню.
Дописываете class к пункту и пишете ему css свойства выбранного элемента (тут уже на ваше усмотрение изменить цвет, подчеркнуть и т.д.)
Добавлено из комментария.
html:
<a href="">link1</a>
<a href="">link2</a>
<a href="" class="active">link3</a>
<a href="">link4</a>
css:
.active{
color:#f00;
}
можно сделать с помощью jquery
<script type="text/javascript">
$('document').ready(function() {
$('.menu a').each(function() {
if ('http://site.ru'+$(this).attr('href') == window.location.href)
{
$(this).addClass('active');
}
});
});
</script>
Добавить класс menu в любое меню на странице(их даже может быть не сколько) и соответственно прописать стили для класса active
Так же вариант в php
<?php foreach($result as $item): ?>
<a href="/link.php?menu=<?php echo $item['id']; ?>" <?php if($_GET['menu'] == $item['id']) {echo "class='active'";} ?>><?php echo $item['name']; ?></a>
<?php endforeach; ?>
О да, все отлично! Но есть небольшой вопрос, как задать класс для <li> вместо ссылки, если ссылка находится внутри <li>?
Если ссылка <a...> лежит непосредственно в <li>, то можно так:
<script type="text/javascript">
$('document').ready(function() {
$('.menu a').each(function() {
if ('http://site.ru'+$(this).attr('href') == window.location.href)
{
$(this).parenrt().addClass('active');
}
});
});
</script>
То есть класс "active" присвоить родительскому элементу.