« A vertical menu done in CSS | Home | Recursive quicksort »
Nice CSS tab menu with PHP
if (isset($_REQUEST['tab'])) {
$tab = $_REQUEST['tab'];
} else {
$tab = 0;
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Controling CSS Tabs Using PHP</title>
<style type="text/css">
/*Credits: Vijit Patil */
.tabZ{
padding: 3px 0;
margin-left: 0;
font: bold 12px Trebuchet MS ;
text-align: left;
border-bottom: 1px solid gray;
list-style-type: none;
}
.tabZ li{
display: inline;
margin: 0;
}
.tabZ li a{
text-decoration: none;
padding: 3px 7px;
margin-right: 3px;
border: 1px solid gray;
border-bottom: none;
background-color: #FDEAFD;
color: #2d2b2b;
}
.tabZ li a:visited{
color: #2d2b2b;
}
.tabZ li a:hover{
background-color: #FF8AFF;
color: black;
}
.tabZ li a:active{
color: black;
}
.tabZ li.selected a{/*selected tab*/
position: relative;
top: 1px;
padding-top: 4px;
background-color: #FF8AFF;
color: black;
}
</style>
</head>
<body><p> </p>
<?php
switch ($tab) {
case 1: //Manage User Tab1
?>
<ul class="tabZ">
<li><a href="PHPtabZ.php?tab=0">Tab1</a></li>
<li class="selected"><a href="PHPtabZ.php?tab=1">Tab 2</a></li>
<li><a href="PHPtabZ.php?tab=2">Tab 3</a></li>
</ul>
<?php
break;
case 2: // Manage User Tab2
?>
<ul class="tabZ">
<li><a href="PHPtabZ.php?tab=0">Tab1</a></li>
<li><a href="PHPtabZ.php?tab=1">Tab 2</a></li>
<li class="selected"><a href="PHPtabZ.php?tab=2">Tab 3</a></li>
</ul>
<?php
break;
default: // Manage User TabDefault
?>
<ul class="tabZ">
<li class="selected"><a href="PHPtabZ.php?tab=0">Tab1</a></li>
<li><a href="PHPtabZ.php?tab=1">Tab 2</a></li>
<li><a href="PHPtabZ.php?tab=2">Tab 3</a></li>
</ul>
<?php
break;
}
?>
</body>
</html>
Topics: PHP, apache, css | Submitter: admin
Comments
You must be logged in to post a comment.