Per inserire nella propria pagina un link ad una finestra pop-up (o pop up) si fa ricorso solitamente a Javascript. I metodi principalmente utilizzati sono due. Il primo viene utilizzato se nella pagina sono presenti più link destinati ad aprire una finestra pop-up, il secondo invece è utilizzato quando il link da aprire è solamente uno.
1. Inserire tra i tag <head> </head> della pagina, il seguente codice che provvederà ad inizializzare la funzione.
<script>
function apri(url) {
newin = window.open(url,'titolo','scrollbars=no,resizable=yes, width=200,height=200,status=no,location=no,toolbar=no');
}
</script>
Nel corpo della pagina andrà inserito il riferimento al link in questo modo:
<a href="javascript:apri('pagina.htm');">Apri la pop-up</a>
Naturalmente al link pagina.htm andrà sostituito il link che si desidera aprire (es. http://www.html.it).
2. Il secondo metodo è un Javascript in linea da utilizzare senza nessun altro riferimento.
<a href="javascript:;"
onClick="window.open('http://www.html.it', 'titolo', 'width=400, height=200, resizable, status, scrollbars=1, location');">
Apri la pop-up</a>
Anche qui a pagina.htm andrà sostituito il nome della pagina che si vuole aprire.
Se si desidera linkare un’immagine basta sostituire al testo “Apri la pop-up” il codice HTML per la visualizzazione dell’immagine, ad esempio:
<a href="javascript:;" onclick="window.open('pagina.htm', 'titolo', 'width=400, height=200, resizable, status, scrollbars=1, location');">
<img src="img.gif" height="100" Width="100" alt="Testo alternativo accessibile" title="Si apre in una pop-up" border="0" />
</a>
Agendo sui parametri width e height si definiscono le dimensioni della finestra (rispettivamente larghezza e altezza). Gli altri parametri vengono utilizzati per le opzioni di visualizzazione.
Se si vuole rendere più gradevole la visualizzazione della pop-up si possono utilizzare le finestre chromeless.