Here is what my page is suppose to look like.
There are clickable tabs at the top namely: Home, About, Contact Us.
When I click on the About tab for example, the content for the About would be displayed. However, the content for the Home tab is still there. I want it to not appear anymore. How can I make this work? Here are my codes:
index.php
<html>
<head>
<?php echo "<link rel=\"shortcut icon\" href=\"images/titlebar.png\" />"; ?>
<?php echo "<link rel=\"stylesheet\" type=\"text/css\" href=\"CSS/index.css\" />"; ?>
<title>Some Text Here</title>
</head>
<body>
<div id="container1">
<?php include("includes/header.php"); ?>
<div id="container2">
<?php include("includes/login.php"); ?>
<?php include("includes/content.php"); ?><br><br><br><br>
<?php include("includes/footer.php"); ?>
</div>
</div>
</body>
</html>
header.php
<div id="header">
<div id="head1">
<img src="images/header.jpg" height="100px">
<div id="head2">
Some Text Here
</div>
</div>
<?php include("includes/pagenavigation.php"); ?>
</div>
pagenavigation.php
<div id="navigation"><b>
<ul>
<li><a href="?home=true">Home</a></li>
<li><a href="?about=true">About</a></li>
<li><a href="?contactus=true">Contact Us</a></li>
</ul>
</b></div>
content.php
<div>
<div id="middlecontainer">
<h3>Featured</h3>
<div id="info1">
Some Text Here
</div>
<div id="info2">
Some Text Here
</div>
</div>
<div id="rightcontainer">
<h1>Welcome</h1>
<p>Some Text Here for the Main page which is the Home tab.</p>
</div>
</div>
Also, there is a login form here. For example, when I have successfully logged in, I want the text on top of the form "Login Area" to be changed to "Admin Area". I tried using the str replace function but it still won't replace the "Login Area" text. It will instead display the "Admin Area" text right after the "Login Area" text. How do I correct this? Here is my login code:
login.php
<div id="leftcontainer">
<?php $username="admin"; $password="admin"; ?>
<div id="loginheader">
Login Area
</div>
<div id="login"><br>
<form action="" method="post">
<font size="2px">Username</font><br>
<input name="user" type="text" size="16" value="" /><br>
<font size="2px">Password</font><br>
<input name="pass" type="password" size="16" value="" />
<p><input name="sub" type="submit" value="Login" /></p>
</form>
<?php
if (isset($_POST["sub"])) {
if (isset($_POST["user"]) and isset($_POST["pass"])) {
if ($_POST["user"]!=$username and $_POST["pass"]!=$password) {
echo "<font style='color: blue; text-align: center; font-size:12px; font-weight: bold;'>*INVALID! Try again.</font>";
}
}
}
?>
</div><br><br>
<div id="guestheader">
Guest Area
</div>
<b><p>* guest 1<br>
* guest 2<br>
* guest 3<br>
* guest 4</p></b>
</div>