Alertify es un script escrito con Jquery, el cual nos permite utilizar los siguientes elementos Javascript personalizados: alert(), confirm() y prompt(). Además también nos permite utilizar sus notificaciones, las cuales son muy agradables y sencillas de utilizar y modificar.

Este script está completamente en Inglés en su página oficial. Pero cuando en Reacción estudio estuvimos probando este maravilloso script, cambiamos algunas cosillas de la interfaz como las etiquetas de los botones al Español (ok por aceptar o cancel por cancelar) y también el orden de los botones, ya que en el script original primero aparece el botón de cancelar y luego el de aceptar, nosotros lo hemos puesto al revés ya que es más natural. Además de incluir en el paquete un archivo de ejemplo con todas las funciones que dispone este script y su utilización.

El código javascript del archivo de ejemplo es el siguiente, así podéis echar un vistazo a la sencillez de las funciones de este script:

/*
--------------------------------------------------------------------------------
| EJEMPLO Y SCRIPT ADAPTADO AL ESPAÑOL POR http://blog.reaccionestudio.com/    |
--------------------------------------------------------------------------------
|	VISÍTANOS !!!                                                          |
--------------------------------------------------------------------------------
*/
function alerta(){
	//un alert
	alertify.alert("<b>Blog Reaccion Estudio</b> probando Alertify", function () {
		//aqui introducimos lo que haremos tras cerrar la alerta.
		//por ejemplo -->  location.href = 'http://www.google.es/';  <-- Redireccionamos a GOOGLE.
	});
}
			
function confirmar(){
	//un confirm
	alertify.confirm("<p>Aquí confirmamos algo.<br><br><b>ENTER</b> y <b>ESC</b> corresponden a <b>Aceptar</b> o <b>Cancelar</b></p>", function (e) {
		if (e) {
			alertify.success("Has pulsado '" + alertify.labels.ok + "'");
		} else { 
                        alertify.error("Has pulsado '" + alertify.labels.cancel + "'");
		}
	}); 
	return false
}
			
function datos(){
	//un prompt
	alertify.prompt("Esto es un <b>prompt</b>, introduce un valor:", function (e, str) { 
		if (e){
			alertify.success("Has pulsado '" + alertify.labels.ok + "'' e introducido: " + str);
		}else{
			alertify.error("Has pulsado '" + alertify.labels.cancel + "'");
		}
	});
	return false;
}
			
function notificacion(){
        //una notificación normal
	alertify.log("Esto es una notificación cualquiera."); 
	return false;
}
			
function ok(){
        //una notificación correcta
	alertify.success("Visita nuestro <a href=\"http://blog.reaccionestudio.com/\" style=\"color:white;\" target=\"_blank\"><b>BLOG.</b></a>"); 
	return false;
}
			
function error(){
        //una notificación de error
	alertify.error("Usuario o constraseña incorrecto/a."); 
	return false; 
}

Aquí podéis ver el ejemplo:

    Ver ejemplo

Aquí os dejos los enlaces de descarga:

    Descargar versión oficial

    Descargar versión en Español

Sobre Reacción Estudio

Somos un estudio informático formado por jóvenes centrados en el desarrollo web, el diseño gráfico y la fotografía. Puedes solicitar presupuesto para tu proyecto a través de nuestra página web o por teléfono, pero en este blog hablaremos de todo lo que engloba el desarrollo web a día de hoy.


  • Julio Vera Segura

    Están perfectas tus notificaciones amigo pero existe un detalle en Explorer (Tenia que ser explorer) no se ve bien

  • Luís Adrián Olvera Facio

    genial gracias compadre, me pusiste más chulo mi proyecto. :)

  • Josue Martínez Rangel

    Hola, no saben como hacer que funcione en IE10? e intentado pero no se me da mucho el css, solo cosas muy simples :S

  • Jose

    Buen dia, me pueden decir como utilizo este codigo para que me permita elimar ?

    he tratado de aplicarlo a mi codigo para eliminar unavez doy click en aceptar: function confirmar(), pero no hace nada, ya sear que de click en aceptar o cancelar no encuentro la manera que haga una accion como eliminar

    • Adrian Namuche

      Solucionaste esto? yo tengo el mismo inconveniente, me comentas tu solución por favor

  • Lucas

    Los mensajes que se para que salgan en la funcion, no se ven

  • Gustavo

    alguien tiene los archivos????

Este sitio web utiliza cookies para que usted tenga la mejor experiencia de usuario. Si continúa navegando está dando su consentimiento para la aceptación de las mencionadas cookies y la aceptación de nuestra política de cookies.     ACEPTAR