Does anyone know how to make the current tab / page your are on to active and not only on hover?
My menu does change color when hover but i want it to be active when you click on it and switch when you go to another page
I tried to add li id="show"
and css in global.css
#show
background-color: blue etc;
color:FFF;
but then all li in the menu is active / the one i set it to but it dont switch when i go to another page
use active class like this:
<ul>
<li class="menuitem active">Page A</li>
<li class="menuitem">Page B</li>
<li class="menuitem">Page C</li>
</ul>
when add menu on page A add active for Page A
when add menu on page B add active for Page B
......
(2022-12-19, 10:59 PM)Mostafa.Shiraali Wrote: [ -> ]use active class like this:
<ul>
<li class="menuitem active">Page A</li>
<li class="menuitem">Page B</li>
<li class="menuitem">Page C</li>
</ul>
when add menu on page A add active for Page A
when add menu on page B add active for Page B
......
Thanks for your reply
i tried this but when ever i go to another page it is still active
https://imgur.com/a/JRDUXT9
(2022-12-23, 03:19 PM)Taylor M Wrote: [ -> ]https://stackoverflow.com/questions/2006...sed-on-url
Thanks for reply found a solution that works kinda
My home nav works now but when i switch to etc members it doesnt go active
my nav:
<div class="haut">
<span class="useroptions">
<ul id="menu-deroulant">
<li><a href="{$mybb->settings['bburl']}"><i class=""></i>HJEM</a></li>
<li><a href="{$mybb->settings['bburl']}/memberlist.php"><i class=""></i>MEDLEMMER</a></li>
<li><a href="{$mybb->settings['bburl']}/misc.php?action=store"><i class=""></i>BLIV MEDLEM</a></li>
<li><a href="{$mybb->settings['bburl']}/showteam.php">TEAM</a></li>
<li><a href="{$mybb->settings['bburl']}/misc.php?action=help"><i class=""></i>HJÆLP</a></li>
<li><a href="{$mybb->settings['bburl']}/search.php"><i class=""></i>SØG</a></li>
{$welcomeblock}
</ul>
</span>
</div>
and my script i use placed on the index page:
<script>
function setActive() {
linkObj = document.getElementById('menu-deroulant').getElementsByTagName('a');
for(i=0;i<linkObj.length;i++) {
if(document.location.href.indexOf(linkObj[i].href)>=0) {
linkObj[i].classList.add("active");
}
}
}
window.onload = setActive;
</script>
and my css:
a.active {
background-color: #227093;
color: #fff;
}
Well i remove the script from header / index page
added it to headerinclude insted and now it works on all pages but the HOME buttons stays active when switching page