Hi, I'm trying to use php in my navigation. What I have is a list based navigation with 3 main levels each having their own sublevels. I only want the main levels visible unless one is clicked on. So if you click on "link 1" it takes you to its page and also reveals its sublinks. My code is as follows:
<div id="nav">
<ul class="open">
<li>Federal Services
<ul<?php if ($thisPage=="Page 1") {
echo " class=\"open\"";
} else " class=\"closed\""; ?>>
<li id="item1_1"><a href="page2.php">Health, Safety, Security & Environmental (HSSE)</a></li>
<li id="item1_2"><a href="page3.php">Process Safety/Risk Management</a></li>
<li id="item1_3"><a href="page4.php">Program Management</a></li>
<li id="item1_4"><a href="page3.php">Technical & Logistical Support</a></li>
</ul>
</li>
</ul>
</div>
Each page hase an 'id' at the top:
<?php $thisPage="Page 1"; ?>
The navigation is referenced in each page with an include statement:
<?php include("navigation.php"); ?>
And I'm using CSS to try to hide and show the sub lists:
#navigation ul {
list-style: none;
}
#navigation a {
color: #FDB179;
font-weight: bold;
padding: 5px 10px;
text-decoration: none;
}
#navigation a:hover {
color: #019587;
}
#navigation #currentpage a {
list-type-style: none;
list-style: none;
font-family: Verdana, sans-serif;
text-align: left;
font-size: .9em;
font-weight: bold;
margin-left: 25px;
margin-top: -11px;
color: #019587;
}
/*Begin original styles */
.open {
display: block;
}
.closed {
display: none;
}
I hope I was able to explain this well enough. I appreciate any help!
Jeff
