Popup met Javascript
Popups worden vaak als storend ervaren, maar in sommige gevallen kunnen ze erg nuttig zijn. Een popup is makkelijk te maken met Javascript.
Popup met een link
Met de onderstaande code kun je een simpele link maken, die een popup opent als je erop klikt.
In de bovenstaande code vul je bij URL de pagina in die je wilt openen, bij naam de naam van het nieuwe venster en bij opties de overige optie's (zie onderstaand lijstje voor een opsomming van de mogelijkheden).
- width - bepaalt de breedte in pixels
- height - bepaalt de hoogte in pixels
- left - bepaalt de afstand van de popup tot de linkerrand van het scherm, in pixels
- top - bepaalt de afstand van de popup tot de bovenrand van het scherm, in pixels
- location - kan op yes of no gezet worden om te bepalen of de adresbalk van de browser weergegeven moet worden. Let op: dit is slechts een aanbeveling voor de browser. Sommige browsers hebben hun eigen instellingen.
- status - kan op yes of no gezet worden om te bepalen of de statusbalk van de browser weergegeven moet worden. Let op: dit is slechts een aanbeveling voor de browser. Sommige browsers hebben hun eigen instellingen.
- menubar - kan op yes of no gezet worden om te bepalen of de menubalk van de browser weergegeven moet worden. Let op: dit is slechts een aanbeveling voor de browser. Sommige browsers hebben hun eigen instellingen.
- toolbar - kan op yes of no gezet worden om te bepalen of de toolbar van de browser weergegeven moet worden (hierop staan de knoppen voor vorige en volgende pagina). Let op: dit is slechts een aanbeveling voor de browser. Sommige browsers hebben hun eigen instellingen.
- resizable - kan op yes of no gezet worden om te bepalen of de bezoeker de grootte van de popup mag wijzigen. Let op: dit is slechts een aanbeveling voor de browser. Sommige browsers hebben hun eigen instellingen.
- scrollbars - kan op yes of no gezet worden om te bepalen of de browser scrollbars moet weergeven als dat nodig is. Let op: dit is slechts een aanbeveling voor de browser. Sommige browsers hebben hun eigen instellingen.
Alle optie's zijn optioneel, behalve width en height. Je scheidt de optie's met een komma. Als je alle optie's ingevuld hebt, zou je bijvoorbeeld de onderstaande code kunnen krijgen.
Dit is het resultaat van bovenstaande code:
Klik hier
Popup bij het openen van een pagina
De bovenstaande code opent een popup als je op een link klikt. Je kunt er echter ook voor kiezen de popup automatisch te laten openen bij het laden van de pagina. Dat kan met de onderstaande code, die je tussen de head-tags in je HTML plaatst. Let op: bezoekers kunnen deze spontane popups als storend ervaren!
Vervolgens moet je ook nog de body-tag aanpassen om de popup-functie op te roepen.
