Forums
This topic is locked
3 State CSS tabs navigation, problem with PHP code
Posted 27 Aug 2009 14:46:57
1
has voted
27 Aug 2009 14:46:57 Christopher Powell posted:
Hi there, i've been working my way through the above tutorial by Sebastian Sulinski in order to achieve this:www.sebastiansulinski.co.uk/demos/3_state_tabs/?p=products
However mine doesn't look like that
. I'm pretty sure it's a problem with my PHP code i'm using to create the active button. Does anyone have the _function.php file that your told to create in the tutorials?
Just so i can compare it with mine...
Cheers
Mine looks like that anyway.
<?php
if (isset($_GET['p']) && $_GET['p'] !=''){
$p = $_GET['p'];
} else{
$p = 'home';
}
function getActive($v) {
global $p;
if ($p == $v) {
echo ' class="act"';
}
}
?>Replies
Replied 27 Aug 2009 14:55:15
27 Aug 2009 14:55:15 Christopher Powell replied:
Oh and i may as well include the CSS and HTML that goes with it all...
HTML
@charset "utf-8";
* {
margin:0px;
padding:0px;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#f1f1f1;
outline:none;
text-decoration:none;
}
body {
text-align:center;
background:#000;
line-height:20px;
}
p {
padding-bottom::14px;
}
a:hover {
color:#333;
}
#out {
width:100%;
background: url(../images/bk.gif) repeat-x 0px 0px #686966;
border-bottom: solid 1px #a8a4a4;
}
#wr, fti {
text-align:left;
width:800px;
margin:0px auto;
}
#ph {
width:100%;
height:100px;
position:relative;
}
#phnv {
width:800px;
height:39px;
background-image:url(../images/phnv.png) 0px -39x;
position:absolute;
left:0px;
top:61px;
list-style:none;
}
#phnv li {
float:left;
background-image:url(../images/phnv.png);
background-repeat:no-repeat;
}
#phnv li a {
display:block;
height:39px;
width:160px;
text-indent:-999999em;
overflow:hidden;
background-image:url(../images/phnv.png);
background-repeat:no-repeat;
}
#btn_1 {
background-position:0px -78px;
}
#btn_2 {
background-position:-160px -78px;
}
#btn_3 {
background-position:-320px -78px;
}
#btn_4 {
background-position:-480px -78px;
}
#btn_5 {
background-position:-640px -78px;
}
#btn_1 a {
background-position:0px 0px;
}
#btn_2 a {
background-position:-160px 0px;
}
#btn_3 a {
background-position:-320px 0px;
}
#btn_4 a {
background-position:-480px 0px;
}
#btn_5 a {
background-position:-640px 0px;
}
#phnv li a:hover {
background-image:none;
}
#phnv li .act, #phnv li a.act, #phnv li a.act:hover {
background-image:none;
}
HTML
<?php include('inc/_functions.php'); ?>
<!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=utf-8" />
<title>3 State CSS Tabs Navigation</title>
<link href="Styles/core.css" rel="stylesheet" type="text/css" />
</head>
<div id="out">
<div id="wr">
<div id="ph">
<ul id="phnv">
<li id="btn_1"<?php getActive('home'); ?>><a href="?p=home"<?php getActive('home'); ?>>Home page</a></li>
<li id="btn_2"<?php getActive('about'); ?>><a href="?p=about"<?php getActive('about'); ?>>About us</a></li>
<li id="btn_3"<?php getActive('products'); ?>><a href="?p=products"<?php getActive('products'); ?>>Products</a></li>
<li id="btn_4"<?php getActive('services'); ?>><a href="?p=services"<?php getActive('services'); ?>>Services</a></li>
<li id="btn_5"<?php getActive('contact'); ?>><a href="?p=contact"<?php getActive('contact'); ?>>Contact us</a></li>
</ul>
</div>
<div id="hd">by Sebastian Sulinski</div>
<div id="cnt"></div>
</div>
</div>
<div id="ft">
<div id="fti">
<p><a href="http://www.sebastiansulinski.co.uk" title="Web Design Tutorials" target="_blank">Web Design Tutorials</a></p>
</div>
</div>
</body>
</html>
Edited by - Christopher Powell on 27 Aug 2009 14:57:36
Replied 16 Sep 2009 17:49:08
16 Sep 2009 17:49:08 Patrick Julicher replied:
Hi Christopher,
Could you also post a link to a testpage to view?
Kind regards, Patrick
Could you also post a link to a testpage to view?
Kind regards, Patrick
Replied 23 Sep 2009 16:28:39
23 Sep 2009 16:28:39 Christopher Powell replied:
turnip14.oxyhost.com/3%20State%20CSS%20Tabs/index.php?p=home
ah there's the link...and for some reason it's working fine now...must just be dreamweaver that's having an issue displaying it... :S
ah there's the link...and for some reason it's working fine now...must just be dreamweaver that's having an issue displaying it... :S
Replied 23 Sep 2009 20:20:45
23 Sep 2009 20:20:45 Patrick Julicher replied:
Hi Christopher,
Glad it is working now. Thanks for letting us now. Good luck on further development.
Kind regards, Patrick
Glad it is working now. Thanks for letting us now. Good luck on further development.
Kind regards, Patrick