Mayo 15, 2007 at 5:52 pm · Filed under General
Dando vueltas a cual sería la forma más sencilla de que las imagenes de nuestras páginas web cambiaran al pasar el ratón por encima (rollover), he preparado una sencilla función que evita enguarrar nuestro (X)HTML. Yo me decanto por usar mootools para mi código javascript, pero no resultará dificil portarlo a otros frameworks.
Lo primero que debemos hacer es preparar nuestras imagenes. Es importante la nomenclatura que usamos para nuestras imagenes. La imagen “inactiva” deberá terminar en _off y la que se activará al pasar el ratón en _on, asi que por ejemplo podemos usar estos de imagenes:
boton1_off.png // imagen desactivada
boton1_on.png // imagen activada al pasar el ratón
No hay que olvidar añadir mootools en la seccion head de nuestra web:
<script src="js/mootools.js" type="text/javascript" charset="utf-8"></script>
Ahora debemos indicar que queremos que esa imagen cambie al pasar el cursor por encima, de una manera muy sencilla. Agregando la clase rollover a nuestra imagen:
<img src="img/boton1_off.png" alt="Prueba rollover" class="rollover" />
Y ya está, no hay que añadir nada más a nuestro (X)HTML.
Esta es la función que iniciará el efecto rollover:
function iniciarRollOver () {
$$("img.rollover").forEach (function(el) {
el.addEvent("mouseenter", function() {
var imgPath = this.getProperty("src");
var imgPath_on = imgPath.replace(/_off/g,"_on")
this.setProperty("src", imgPath_on );
});
el.addEvent("mouseleave", function() {
var imgPath = this.getProperty("src");
var imgPath_off = imgPath.replace(/_on/g,"_off")
this.setProperty("src", imgPath_off );
});
});
}
}
Solo nos queda llamar a nuestra función cuando se hayan cargado todos los elementos de la página, para ello recomiendo usar el evento domready de mootools de la siguiente manera.
window.addEvent( "domready", iniciarRollOver );
Espero que os resulte últil. Un saludo.
Mayo 11, 2007 at 6:33 pm · Filed under General
Buenas a todos, retomo este blog para poder escribir sobre cosicas mas geeks.
Hoy voy a hablaros de las sesiones en PHP, y los problemas que hay cuando usamos conjuntamente la codificación utf-8 y sesiones en PHP.
Hace años que no tocaba el tema de las sesiones, pero ahora por azares del destino me ha tocado hacerlo de nuevo.
Lo tenía un poco oxidao pero de algo me acordaba, como que había que iniciar la sesion antes de mostrar cualquier output. Así que he puesto en mi página de inicio index.php el inicio de la sesion al principio del todo, antes incluso que el DOCTYPE, tal y como recordaba.
<?php
session_start();
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>
(...)
He preparado mi sistema de autentificación de usuarios, etc.. todo parecía funcionar de puta madre, perooooooo…. no se guardaban los datos de la sesion…. vaya mierda de sesión….
Me he pegao toda la mañana volviendome loco buscando algún fallo en mi código, sin encontrar ninguno. Así que me he levantado, me he visto una peli y he vuelto al ordenador.
Revisando la documentación en php.net he visto un comentario perdido que decía algo de incompatibilidades entre las sesiones y la codificación utf-8. Que si usabamos esta codificación, hay que iniciar la sesión despues de indicar que la ibamos a usar. Bien mediante:
header('Content-Type: text/html; charset=utf-8');
o usando la etiqueta html correspondiente:
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
Así que dicho y hecho, ordenando mi código asi:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<?php
// INICIAMOS LA SESION
// Hay que iniciar la sesion despues de especificar la codificación utf-8
// Para que los datos se guarden
session_start();
?>
(...)
Funciona de rechupete…
Espero que no os pase lo mismo que a mi nunca, y si os ocurre la solución es levantarse esperar una hora o dos haciendo otra cosa y volver. Milagrosamente dareís con la solución en 5 minutos.
Salúd
