Appunti su JavaScript

§ 1. How To - Popup

Per realizzare un popup c'è bisogno di codice html, css e js.

In questo esempio cliccando su "Click me!" compare una specie di fumetto.

l'HTML è questo e serve a collegare gli elementi html visualizzati con gli appropriati codici css e js.

            <div class="popup" onclick="myFunction()">Click me!
               <span class="popuptext" id="myPopup">Popup text....</span>
            </div> 

Questo è il codice js:

function myFunction() {
    var popup = document.getElementById("myPopup");
    popup.classList.toggle("show");
}

Il cuore di questa funzione è popup.classList.toogle("show")

La proprietà classList restituisce il/i nomi delle classi css di un elemento, nella forma di un oggetto DOMTokenList

Ora cosa è un oggetto DOMTokenList?

§ 2. Cosa sono le finestre di popup.

Da un articolo di Luca Ruggero su html.it

Le popup sono finestre del browser aperte mediante un JavaScript che può agire sul loro aspetto e su alcune sue componenti, come la barra di stato, la barra dei menu, la barra degli strumenti, la barra di scorrimento, sulle sue dimensioni e sul posizionamento assoluto nell’area dello schermo.

Per capire cosa è in grado di fare JavaScript la miglior cosa da fare è vedere un primo semplice esempio di finestra aperta in modalità popup.

Ecco finalmente quello che cercavo!

§ 2.1. Primo esempio di finistra popup.

APRI

var stile = "top=10, left=10, width=250, height=200,
             status=no, menubar=no, toolbar=no scrollbars=no";

function Popup(apri) 
{
  window.open(apri, "", stile);
}