Come inserire una finestra PopUp

Francesco PC Academy di - 23 maggio 2012 in Altro, Web Design

Per inserire in una pagina web una finestra PopUp si fa ricorso in genere a Javascript. I metodi di inserimento sono due, il primo utilizzato se sono più link a dover essere aperti in una finestra popup, il secondo invece utilizzato se il link è solamente uno.

Il Primo.

Per il primo metodo i passaggi sono molto semplici:

Tra i tag <Head></head> dovete inserire il seguente codice:

<script type=”text/javascript”>
function apri(url) {
newin = window.open(url,’titolo’,’scrollbars=no,resizable=yes, width=200,height=200,status=no,location=no,toolbar=no’);
}
</script>

 

e invece nel Body, nel link che volete aprire nella finestra popup dovrete inserire questo codice:

<a href=”javascript:apri(‘pagina.htm’);”>Apri la pop-up</a>

 

Ovviamente al posto di “pagina.html” dove inserire il nome della pagina volete aprire.

Il secondo.

Il secondo invece prevede sempre l’inserimento del codice sopraindicato nell’head ma cambia invece il codice da inserire nel Body.

Nel tag Body dovrete inserire questo codice:

<a href=”javascript:;” onClick=”window.open(‘pagina.htm’, ‘titolo’, ‘width=400, height=200, resizable, status, scrollbars=1, location’);”>Apri la pop-up</a>

 

Potete cambiare la larghezza (width) e l’altezza (height), anche qui dovete cambiare “pagina.htm” con la pagina che volete inserire.

 

Esistono però altre due sfaccettature a seconda del PopUp di cui abbiamo bisogno, andiamole a vedere:

Se vogliamo il popup si apra direttamente con l’apertura della pagina?

Dovete inserire il seguente codice di richiamo nell’intestazione del Body

 

<body onLoad=”javascript:PopUp(‘INDIRIZZO PAGINA WEB’)”>

 

Se invece volete si apra quando chiudete la pagina:

<body onUnload=”javascript:PopUp(‘INDIRIZZO PAGINA WEB’)”>

 

 


Share

Promozioni

Potrebbe interessarti



Francesco PC Academy
Francesco: Lavora come freelance, si occupa di Web Design & Marketing, Strategie Digitali, Blogging e docenza. Per PC Academy cura: il tutoraggio dei corsi online Scrittura Creativa e Sceneggiatura; le lezioni in aula sulla creazione del CV infografico e come Presentarsi alle Aziende in modo professionale; la redazione di molti articoli di questo portale.

Commenti