Bienvenido a datoweb.com!! En este foro podrás encontrar ayuda sobre diseño y desarrollo web en general. Si quieres formar parte de esta comunidad para pedir ayuda o colaborar ayudando a otros usuarios del foro solo tienes que registrarte desde el siguiente enlace: Registrarse en el Foro

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
1278
Visitas
1
Resp
Por Dannus hace 101 meses
Avanzado
Respuesta #1
Lo probare.. Tiene muy buena pinta :)
0
Puntos
Por zapikero hace 101 meses
Avanzado Sitio web
Compartir en facebook
Compartir en twitter
Compartir
Para comentar Inicia sesión o Registrate