Colores distinto en la web

Hace poco tuve que hacer una web donde el usuario podría cambiar de color, busque un poco por internet y encontré un scrpit muy bueno y lo comparto para vosotros.

index.php

<!doctype html>
<html>
<head>


//script para la variable COOKIE
<?php 
	if(!empty($_COOKIE['_theme'])) $style = $_COOKIE['_theme'];
	else $style = "none";
?>
//en el link el href se cambia la variable de ruta
<link rel="stylesheet" type="text/css" href="css/<?php echo $style ?>.css">


</head>
<body>

</body>
</html>

creamos el archivo theme.php:

<?php
$tema=$_GET['thm'];
setcookie('_theme',$tema,time()+(86400*365),"/","");
if(isset($_GET['async'])) {
	echo $tema;
}else{
	header("Location: ".$_SERVER['HTTP_REFERER']);
}
?>

creamos el archivo jquery.functions.js

$(document).ready(function(){
	
	// click en cualquier link </a> del contenedor #estilos
	$("#estilos a").click(function(){
		CargarCSS(this);
		return false;
	});
	
	function CargarCSS( CSSelegido ) {
		// obtener contenido del link </a> 
		// la variable async servira para identificar contenido asyncrono
		$.get( CSSelegido.href+'&async',function(data){
			// cambiarmos atributo href del elemento hoja_estilo, obtenido de theme.php
			$('#hoja_estilo').attr('href', data + '.css');
		});
	}
});

ya solo para cambiar las hojas de estilos usamos el siguiente link:

<a id="style" href="theme.php?thm=style">Estilo 1</a>
<a id="style1" href="theme.php?thm=style1">Estilo 2</a>

si queremos poner mas hojas de estilo para cada color solo ampliamos:
<a id="style2" href="theme.php?thm=style2">Estilo 3</a>

Esperos que os guste

2
Puntos

1250
Visitas

1
Resp

Por dannus hace 10 años

Developer

Respuesta #1

Lo probare.. Tiene muy buena pinta :)

0
Puntos

Por zapikero hace 10 años

Developer