Hola,
Me gustaría saber de algún método para hacer que un sitio web cargue un CSS (O una imagen) diferente de acuerdo a la hora del día, y que, por ejemplo, cargue una imagen con entorno nocturno a partir de las 6:00pm de la tarde. ¿Es eso posible?, ¿Cómo lo podría hacer?.
Gracias :)
Puedes hacerlo tanto por php como por javascript. En cuyo caso php seria la hora del servidor y javascript la hora que tiene puesta el usuario.
Si necesitas mas ayuda solo dilo =)
Saludos
Yo creo q con php es mejor y mas facil...!!!
La pregunta sería ahora: "Cómo?..", no les pido que me hagan el código ;) no, sino al menos un termino para empezar a buscar, alguna funcion, o algo por el estilo, ya que he buscado varios "sinonimos" de mi inquietud, y no encuentro nada parecido :(...
Podrías hacer algo así: En donde va la imagen,
<?php echo '<img border="1" src="'.(date('G')<18 ? '/imagenes/imagen_dia.png' : '/imagenes/imagen_noche.png').'" />'; ?>
solo cambias los path, el nombre del las imágenes, etc.
Para el caso del CSS, el estilo, podrías tener dos hojas diferentes y que cargue una u otra de acuerdo a la condición que quieras.
Como te dijo Monkey, eso dependerá de la hora del servidor.
La verdad es que con PHP es mas fácil. Pero hay un problema. Ese problema es que tienes la hora del servidor y no la del cliente. Por eso yo en mi caso usaría javascript. El otro problema es que el cliente igual no tiene javascript y pues.... tendría que usar PHP xD
En ambas lo primero que tienes que hacer es obtener la hora.
En php es mediate: date();
En javascript es una clase: new Date(); y .getHours().
Luego simplemente tendras que hacer un if/else comparando las horas y imprimir el contenido ;)
Esto seria un script para cambiar de css entre horas ya que el ejemplo de php lo tienes arriba y mil veces mejor de lo que te abría dado yo xD
<html>
<head>
<title>Monkeys will rlz.</title>
<script language="javascript">
// Obtenemos la hora (0-23)
var d = new Date();
var Hora = d.getHours();
// Si la hora es menor a 20:00 y mayor a 04:00
if(Hora<20 && Hora>4)
{
// Imprimir CSS de dia
document.write('<link rel="stylesheet" type="text/css" href="cssdedia.css" />');
} else {
// imprimr CSS de noche
document.write('<link rel="stylesheet" type="text/css" href="cssdenoche.css" />');
}
</script>
</head>
<body>
bla bla bla bla bla bla blaallalalalala
</body>
</html>
Se puede hacer de muchas formas pero da =. Lo importante es el ejemplo.
Saludos
Yo en este caso usaría PHP.
Pueda que el usuario edite el código javascript xD.
Pueda que el usuario no tenga javascript activado o desactivado y no funcionaria el source correctamente.
@Yoya
Adicto a la seguridad ? xD
Pues es que php es muy liante en cuanto a saber la hora del usuario y si no tiene javascript lo que puede es usar es un gat noscript y en el insertar el php.
Saludos
Cita de: cassiani en 18 Febrero 2011, 02:26 AM
Podrías hacer algo así: En donde va la imagen,
<?php echo '<img border="1" src="'.(date('G')<18 ? '/imagenes/imagen_dia.png' : '/imagenes/imagen_noche.png').'" />'; ?>
solo cambias los path, el nombre del las imágenes, etc.
Para el caso del CSS, el estilo, podrías tener dos hojas diferentes y que cargue una u otra de acuerdo a la condición que quieras.
Como te dijo Monkey, eso dependerá de la hora del servidor.
me podrias explicar para que sirven esos operadores ? y :, los he visto varias veces ya y no encuentro informacion en ningun lado, siento que me estoy perdiendo de algo muy util
simplifica mucho. Es simplemente usar condiciones y devolver un valor, todo en una sola linea.
Antes del signo de interrogación "?" colocas la condición y entre dos puntos ":", colocas los dos posibles resultados
if (condicion) {
$var = true;
} else {
$var = false;
}
es igual a
$var = condición ? true : false;
Operador ternario:
http://es.wikipedia.org/wiki/Operador_ternario
cassiani: Muchas gracias de verdad era muy util