简体   繁体   中英

How to change the style of an active menu with php + css

So, I'm writing a menu and I want it to stay a certain color based upon it being on that page. I've added "class = 'active'" onto the page, and I've tried adding it to CSS, but it's not working. Any ideas?

PHP code:

<?php
$currentPage = basename($_SERVER['REQUEST_URI']);
print "<div id = 'submenu-container'>";
print "<div id = 'submenu'>";
print "<ul class = 'about'>";
print "     <li><a  href='about.php#about_intro.php'if($currentPage=='about.php#about_intro.php' || $currentPage=='about.php') echo 'class='active''>About</a></li>";
print "     <li><a href='about.php#about_team.php'if($currentPage=='about.php#about_team.php') echo 'class='active''>Team</a></li>";
print "     <li><a href='about.php#about_services.php' if($currentPage=='about.php#about_services.php') echo 'class='active'>Services</a></li>";            
print " </ul>";
print "</div>";
print"</div>";
?>

CSS:

#submenu ul li a .active {
background:#FFF;    
}

$_SERVER['REQUEST_URI'] will never contain the portion after the hash. It will only show up to about.php and any URL arguments passed with the ? . You should create specific pages for each of these, give the about_intro/about_team/about_services in a query string instead of a hash, or add the active class with javascript.

Additionally, don't use an if statement when inside of another statement. Use the ternary operator.

print "<li><a href='about.php'"
    .$currentpage=="about.php"?" class='active'":""
    .">About</a></li>";
print "     <li><a  href='about.php#about_intro.php'if($currentPage=='about.php#about_intro.php' || $currentPage=='about.php') echo 'class='active''>About</a></li>";

doesn't make sense. all this string will be outputted and displayed in html. you must use string concatenation:

$cl = ($currentPage=='about.php#about_intro.php' || $currentPage=='about.php')?" class='active'": "";
print "<li><a  href='about.php#about_intro.php' $cl>About</a></li>";

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM