Para dar información inmediata al usuario en tu pagina, muchas veces has recurrido a la caja de alerta con tan solo un simple ‘alert()’ Aquí te mostramos como mostrar alertas de una mejor manera.

La librería SexyAlerts basada en Mootools te permite el mostrar cajas de alerta que son visualmente mucho mejor que las que te ofrece javascript. Para empezar, baja la librería de la siguiente liga. Para usar la librería, simplemente añade el siguiente código entre los tags de <head>:


<script src="mootools.js" type="text/javascript"></script>
<script src="sexyalertbox.v1.js" type="text/javascript"></script>
<link rel="stylesheet" href="sexyalertbox.css" type="text/css" media="all" />

Añade el siguiente código para crear un objecto ‘Sexy’:


<script type="text/javascript">
window.addEvent('domready', function() {
Sexy = new SexyAlertBox();
});
</script>

Y añade la siguiente liga como ejemplo la cual activara la caja de alerta:


<a href="#" onclick="Sexy.alert('<h1>Ejemplo de Alerta Sexy</h1><br/><p>Sexy Alert es una manera muy simple de mejorar tus ventanas de alerta.</p><p>Visita <a href=\'http://www.teqi.org/\'>www.teqi.org</a> para obtener mas ejemplos de tecnologias Teqi.</p>'); return false;">Has Click en esta liga</a>

Y en el resultado se ve la mejoría:

SexyAlert: EjemploSexyAlert: Ejemplo

Aquí puedes ver el ejemplo en acción.