Abbellire le finestre Alert con JQuery Apprise

La funzione alert() in JavaScript è sicuramente tra le più semplici e utili per comunicare con il visitatore tramite una finestra di pop-up, un problema di questo metodo però è la scarsa bellezza di questa finestra e di come su ogni browser assuma un aspetto totalmente differente.

Con il plugin JQuery Apprise sviluppato da Daniel Raftery, puoi in maniera molto semplice cambiare l’aspetto di pop-up stile alert rendendoli uguali su tutti i browser e totalmente personalizzabili.

Una volta scaricato il plugin nella versione completa o minimizzata, troverai all’interno due file principali, il primo è la libreria con estensione .js, il secondo è il foglio di stile che gestisce l’aspetto delle finestre, per fare funzionare nella tua pagina web Apprise devi richiamare entrambi i file tra i tag head.

<head>
...
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.4.min.js"></script>
...
<script type="text/javascript" src="js/apprise-1.5.full.js"></script>
<link rel="stylesheet" href="css/apprise.css" type="text/css" />
...
</head>

Fatto ciò potrai richiamare la tua finestra dove preferisci nella tua pagina la funzione apprise() al posto della funzione alert(), per esempio:

<a href="http://google.com" onclick="apprise('Stai lasciando il sito');">Lascia il sito</a>

Quindi, quando un visitatore farà un click sul link “Lascia il sito” comparirà la finestra di dialogo con scritto “Stai lasciando il sito”.

Questo plugin è compatibile con iPhone/iPad, Chrome 8.0+, Firefox 3.0+, Safari 4.0+ e con IE9 ma con alcuni bug di stile su IE7 e 8.

Info sull' autore:
Nato a Bologna, mi occupo della realizzazione grafica e dello sviluppo front-end di siti web e sono il fondatore di questo blog. Se vuoi segnalare qualche problema o hai qualche richiesta particolare invia una mail tramite il modulo contatti.
Leggi gli altri articoli di

1 Risposta per Abbellire le finestre Alert con JQuery Apprise