Cambiar color de fondo de web Dinamicamente

Seguro has visto varias webs que ofrecen el efecto de cambiar de fondo o de diseño con tan solo hacer un clic, se me ha ocurrido hacerlo con un simple formulario y algo de PHP, aqui te dejo el videotutorial de como lograr este tremendo efecto.

El Video

*Disculpen los inconvenientes con el audio

El codigo

Aqui esta el resultado final del tutorial

<!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>Documento sin t&iacute;tulo</title>
<?php
$fondo = $_GET['color'];
$personal = $_GET['colorpersonal'];
if ($personal == '') {
if ($fondo == 'Naranja') { ?>
<style type="text/css">
body {
	background: #FF9900;
}
</style>
<link rel="stylesheet" href="estilo-naranja" type="text/css" />
<?php }//del if naranja
elseif ($fondo == 'Verde') { ?>
<style type="text/css">
body {
	background: #00FF33;
}
</style>
<?php }//cierra el elseif verde
else { ?>
<style type="text/css">
body {
	background: #33CCCC;
}
</style>
<?php }//del else (original)
}//del if principal
else { ?>
<style type="text/css">
body {
	background: <?php echo $personal;?>;
}
</style>
<?php } ?>
</head>
 
<body>
<h1>Selecciona el color de fondo que quieras para la pagina</h1>
<form action="" method="get">
<p>Selecciona un color de fondo</p>
<select name="color">
  <option selected="selected">Original</option>
  <option>Naranja</option>
  <option>Verde</option>
</select>
<p>o...Escribe tu color hexadecimal</p>
<input type="text" name="colorpersonal" />
<input name="" type="submit" value="Cambiar Color" />
</form>
</body>
</html>

Mijael es el creador y editor de skyandstars.net donde publica guias y tutoriales sobre WordPress, Cutenews, PHP, HTML y mucho más. Acutalmente estudiante universitario.

Mijael166