index.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">
<html>
<head>
<style type="text/css">
<?php
//--> Controleren of de cookie bestaat
if(isset($_COOKIE['style']))
//--> Hij bestaat wel, laad de style uit een cookie
print('@import "'.$_COOKIE['style'].'.css";');
else
//--> Hij bestaat niet, laad de default stylesheet
print('@import "style1.css";');
?>
</style>
<link rel="stylesheet" type="text/css" href="style/content.css" />
<link rel="stylesheet" type="text/css" href="style/menu_rooster.css" />
<link rel="stylesheet" type="text/css" href="style/menu_home.css" />
<title>Mediatechweb</title>
<body>
<table width="652" border="0" cellpadding="0" cellspacing="0" bordercolor="#131415" style="margin-left:10px;">
<tr>
<td width="100%" height="65"class="headertd" valign="top">
<div class="header"></div>
</td>
</tr>
<tr>
<td>
<div class="menu">
<div class="home"> <a href="setstyle.php?s=1" title="Stylesheet 1">Home</a></div>
<div class="home"><a href="setstyle.php?s=2" title="Stylesheet 2">Rooster</a></div>
</div>
</td>
</tr>
<tr>
<td valign="top" height="100%"><div class="backgroundcontent"></div>
</td>
</tr>
<tr>
<td height="29" valign="top"><div class="footer"></div></td>
</tr>
</table>
</body>
</html>
setstyle.php
<?php
//--> Setstyle.php
//--> Simpele php style changer
//--> Gemaakt door 6(sic)6
ob_start();
/*--> Uitleg
if(isset($_GET['s']) --> Controleert of de s wel bestaat in de url (setstyle.php?s=)
if(empty($_GET['s']) --> Controleert of de s wel een waarde mee heeft gekregen
if(ctype_digit($_GET['s']) --> Controleert of de waarde wel een nummer is
<--*/
if(!isset($_GET['s']) || empty($_GET['s']) || !ctype_digit($_GET['s']))
{
//--> De waarden kloppen dus niet
//--> Foutmelding weergeven
print('De style die je wou instellen bestaat niet.<br>Je word in 2 seconden teruggestuurd.');
//--> Na 2 seconden terugsturen naar de index
header('Refresh: 2; URL=index.php');
}
else
{
//--> Alle meegegeven waarden kloppen, verder gaan met het script
//--> Geeft de waarde van s door aan $id
//--> Niet verplicht om te doen maar vind ik zelf handiger
$id = $_GET['s'];
//--> Controleren of het bestand wel bestaat
if(file_exists('style'.$id.'.css'))
{
//--> Cookie neerzetten met informatie welke style te kiezen (blijft geldig tot 2008 ofzo :p )
setcookie('style', 'style'.$id, time() + 9999*9999);
//--> Terugsturen naar de index
header('Location: index.php');
}
else
{
//--> Als het bestand niet bestaat een foutmelding weergeven
print('De style die je wou instellen bestaat niet.<br>Je word in 2 seconden teruggestuurd.');
//--> En na 2 seconden terugsturen anar de index
header('Refresh: 2; URL=index.php');
}
}
?>
content.css (basic stylesheet)
/* CSS Document */
/*Banner*/
div.header{
background-image:url(../images/logo.gif);
background-repeat:no-repeat;
width:600x;
height:65px;
}
/*Menu*/
div.menu{
background-image:url(../images/menu_background.gif);
background-repeat:no-repeat;
width:600x;
height:20px;
padding-left:13px;
font-weight:bold;
}
div.backgroundcontent{
background-image:url(../images/space.gif);
background-repeat:repeat;
height:100%;
}
div.footer{
background-image:url(../images/footer.gif);
background-repeat:no-repeat;
height:100%;
}
menu_home.css
/* CSS Document */
body{
font-family:"Book Antiqua", "Bookman Old Style", "Garamond", "Times New Roman";
font-size:12pt;
background-image:url(../images/bg1.jpg);
background-repeat:no-repeat;
}
a:link { color: #FFFFFF; text-decoration: none;}
a:visited { color: #FFFFFF; text-decoration: none }
a:hover { color: #C52024; text-decoration: none;}
a:active { color: #C52024; text-decoration: none }
div.home {
float: left;
font-size: 9pt;
width: 40px;
margin-right:20px;
margin-top:3px;
font-family:Arial, Helvetica, sans-serif;
}
menu_rooster.css
/* CSS Document */
body{
font-family:"Book Antiqua", "Bookman Old Style", "Garamond", "Times New Roman";
font-size:12pt;
background-image:url(../images/bg2.jpg);
background-repeat:no-repeat;
}
a:link { color: #FFFFFF; text-decoration: none;}
a:visited { color: #FFFFFF; text-decoration: none }
a:hover { color: #C52024; text-decoration: none;}
a:active { color: #C52024; text-decoration: none }
div.home {
float: left;
font-size: 9pt;
width: 40px;
margin-right:20px;
margin-top:3px;
font-family:Arial, Helvetica, sans-serif;
}
dus als je op home klikt moet de css file "menu_home.css" geladen worden en als je op "rooster" klikt moet "menu_rooster.css" geladen worden..hoop dat dit duidleijk genoeg is