Esempio di codice per realizzare una finestra di popup:
<a xhref="javascript:void(0)" ONCLICK="open('tuo_file.html','miniwin','toolbar=0,location=0,directories=0,status=0,
menubar=0,scrollbars=0,resizable=0,width=600,height=400')">Clicca per aprire il Pop-Up</a>
METODO
L'apertura di una popup del browser è compito specifico di Javascript: viene effettuata tramite il comando window.open(), che può ricevere tre parametri.
Il primo è obbligatorio, gli altri due opzionali:
• url - nome e percorso della pagina da aprire nella finestra di popup - obbligatorio
• titolo - identificatore della pagina, valore arbitrario - opzionale
• attributi - una lista di attributi per la nuova finestra, separati da virgole - opzionale
esempio:
window.open('pagina.html');
oppure:
window.open('pagina.html','flashPopup', 'width=640,height=480,status=yes' );
Notazione importante: la lista degli attributi è una stringa, quindi si apre e chiude con le virgolette o con gli apici singoli. Al suo interno, gli attributi sono separati dalle virgole.
I possibili attributi sono i seguenti (specifico all'inizio solo quelli comuni e prevalentemente compatibili tra Netscape Navigator ed Internet Explorer: separati dagli altri, quelli specifici per il singolo browser):
|
COMPATIBILI AD ENTRAMBI I BROWSER E/O DI USO COMUNE
|
||
|
ATTRIBUTO
|
VALORE
|
DESCRIZIONE
|
|
width
|
numero
|
specifica la larghezza della finestra in pixel, minimo 100 |
|
height
|
numero
|
specifica l'altezza della finestra in pixel, minimo 100 |
|
left
|
numero
|
specifica la distanza della finestra, in pixel, dal lato sinistro dello schermo - per Internet Explorer |
|
top
|
numero
|
specifica la distanza della finestra, in pixel, dal lato superiore dello schermo - per Internet Explorer |
|
screenX
|
numero
|
specifica la distanza della finestra, in pixel, dal lato sinistro dello schermo - per Netscape Navigator, corrisponde all'attributo left per IE |
|
screenY
|
numero
|
specifica la distanza della finestra, in pixel, dal lato superiore dello schermo - per Netscape Navigator, corrisponde all'attributo top per IE |
|
directories
|
yes-no
1-0 |
specifica se debba essere presente o meno la barra dei Collegamenti |
|
location
|
yes-no
1-0 |
specifica se debba essere presente o meno la barra degli Indirizzi |
|
menubar
|
yes-no
1-0 |
specifica se debba essere presente o meno la barra dei Menu |
|
resizable
|
yes-no
1-0 |
specifica se la finestra possa essere ridimensionabile oppure no (non funziona con tutti i browser, e nemmeno in tutte le versioni dello stesso browser) |
|
scrollbars
|
yes-no
1-0 |
specifica se debbano essere presenti o meno le barre di scorrimento, verticale e orizzontale |
|
status
|
yes-no
1-0 |
specifica se debba essere presente o meno la barra di Stato |
|
toolbar
|
yes-no
1-0 |
specifica se debba essere presente o meno la barra degli Strumenti |
|
SOLO PER INTERNET EXPLORER 4 E SUPERIORI
|
||
|
ATTRIBUTO
|
VALORE
|
DESCRIZIONE
|
|
channelmode
|
yes-no
1-0 |
specifica se la finestra debba essere aperta in channelmode (schermo intero con la sola barra degli strumenti) |
|
fullscreen
|
yes-no
1-0 |
specifica se la finestra debba essere aperta in fullscreen (schermo intero senza alcuna barra) |
|
SOLO PER NETSCAPE NAVIGATOR 4 E SUPERIORI
|
||
|
ATTRIBUTO
|
VALORE
|
DESCRIZIONE
|
|
alwaysLowered
|
yes-no
1-0 |
specifica se la finestra di popup debba restare sotto tutte le altre, che sia attiva oppure no |
|
alwaysRaised
|
yes-no
1-0 |
specifica se la finestra di popup debba restare sopra tutte le altre, che sia attiva oppure no |
|
dependent
|
yes-no
1-0 |
specifica se la finestra di popup debba aprirsi come finestra dipendente da quella che l'ha aperta, e chiudersi automaticamente alla chiusura di quest'ultima: inoltre, nei sistemi Windows, la popup non appare nella taskbar, ha una barra del titolo più piccola del normale e con un pulsante di chiusura ridotto |
|
hotkeys
|
yes-no
1-0 |
specifica se abilitare o meno le scorciatoie da tastiera |
|
innerHeight
|
numero
|
specifica l'altezza, in pixel, della sola area dei contenuti della finestra |
|
innerWidth
|
numero
|
specifica la larghezza, in pixel, della sola area dei contenuti della finestra |
|
outerHeight
|
numero
|
specifica l'altezza totale della finestra, in pixel |
|
outerWidth
|
numero
|
specifica la larghezza totale della finestra, in pixel |
|
titlebar
|
yes-no
1-0 |
specifica se la finestra debba avere la barra del titolo |
|
z-lock
|
yes-no
1-0 |
specifica se la finestra debba spostarsi di fronte alle altre una volta attivata |
Per aprire una popup da Flash possiamo procedere i due modi:
1 • html
definire una funzione Javascript per l'apertura della finestra nei tag <head> della pagina html che incorpora il filmato, e richiamarla tramite getURL nella pagina html
<html>
<head>
<title></title> <script language="JavaScript" type="text/JavaScript">
<!--
function apriFinestra([parametri]){
window.open([parametri]);
}
//-->
</script> </head>
<body> <!-- codice di incorporamento del filmato //--> </body>
</html>
nel filmato Flash
getURL("javascript:apriFinestra([parametri])");
2 • flash
non definire alcuna funzione nei tag <head> della pagina, e richiamare il window.open direttamente da flash:
getURL("javascript:window.open([parametri])");
oppure
function apriPopup([parametri]){
getURL("javascript:window.open([parametri])");
} apriPopup([parametri]);
In entrambi i casi è assolutamente necessario che il filmato sia incorporato in una pagina html, dal momento che il supporto al codice Javascript viene dal browser, e non dal plugin del Flash.
Vediamo alcuni casi in entrambi i modi, indicando il primo con la notazione html, e il secondo con la notazione flash.
Fonte: http://flash.html.it/guide/lezione/2921/apertura-di-una-popup/
Commenti offerti da CComment