Question

我目前正在使用此模板开发网站：

<!DOCTYPE html>
<html lang="en" >
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
<link rel="icon" type="image/gif/png" href="">
<meta charset="utf-8">
<title><?php echo $title; ?></title>
<link rel="stylesheet" type="text/css" href="" media="all">
</head>
<body>

<div class="wrapper">
<div class="banner">

</div>
<div class="nav_bar">
    <ul>
     <li><a class="home" href="">Home</a></li>
     <li><a class="news" href="">News</a></li>
     <li><a class="r_faqs" href="">Registration FAQs</a></li>
     <li><a class="howto" href="">How to Register and Rules</a></li>
      <li><a class="sch_reg" href="">Register school</a></li>
      <li><a class="p_reg" href="">Register pupil</a></li>
     <li><a  class="about" href="">About Us</a></li>
      <li><a  class="contact" href="">Contact Us</a></li>
    </ul>

</div>
<div class="content_area">
    <?php echo $content; ?>
</div>
<div class="clear"></div>
</div>
<div class="footer">
<div>       
</div>
</div>

</body>
</html>

我已在垂直导航中设置了右侧内容，如此页http://learn.shayhowe.com/advanced-html-css/complex-selectors/ 现在的问题是当用户在该页面上时如何保持活动菜单突出显示。您可以在此处查看我的页面https://jsfiddle.net/96wxdzk7/3/

Answer 1

<ul class="sub-nav" >
<?php
    $full_name = $_SERVER['PHP_SELF'];
    $name_array = explode('/',$full_name);
    $count = count($name_array);
    $page_name = $name_array[$count-1];
?>
<li><a class="<?php echo ($page_name=='where-to-buy.php')?'active':'';?>" href="where-to-buy.php">WHERE TO BUY</a></li>
<li><a class="<?php echo ($page_name=='about.php')?'active':'';?>" href="about.php">ABOUT US</a></li>
<li><a class="<?php echo ($page_name=='contact.php')?'active':'';?>" href="contact.php">CONTACT US</a></li>

此外，请按照以下网址进行实时演示.. https://webdesignerhut.com/active-class-navigation-menu/

当用户在该菜单上显示活动菜单，并在菜单更改时更改

1 个答案: