weballey logo
 
left forms - image backnext right
homesearchsite mape-mail
intro
text
textarea
buttons
< image >
form
e-mail form
checkbox
radio
select
password
hidden
layout
cgi
tags
slot
 

    Als je de standaard knoppen maar niks vindt, kun je ook een plaatje gebruiken. Je kunt bovendien een image map toepassen. Waardoor je verschillende resultaten krijgt, afhankelijk van waar je klikt. Een IMAGE knop verzend het formulier ALTIJD.

<INPUT TYPE="image" NAME="submit" SRC="button.gif" BORDER="0" ALT="button">

    De html code lijkt op die van een gewoon plaatje, maar is niet helemaal hetzelfde. Je kunt ALT, BORDER, en ALIGN gebruiken, maar geen WIDTH en HEIGHT. Het plaatje wordt opgeroepen met het SRC attribuut.

Image map
    Klik een van de knoppen hierboven eens aan. Je zult zien dat de uitvoer verschilt van andere formulier elementen. Je krijgt namelijk twee variabelen. Beide hebben de naam de je opgegeven hebt, een punt, en x of een y, en een waarde. Deze twee laatste geven aan, waar je op het plaatje geklikt hebt. Met deze waarden kun je een soort image map constructie opzetten. Het betrokken javascript of cgi programma dient dit dan te verwerken, omdat je geen image maps binnen formulieren kunt toepassen.

Reset button
    Mogelijk wil je ook voor de reset knop een plaatje gebruiken. Maar een image knop verzendt altijd het formulier, weet je nog? Dus dit is alleen te doen met een truc. Je gebruikt hiervoor een gelinkt plaatje, met een stukje javascript in het HREF attribuut. Dit zorgt dan voor het resetten van het formulier. Je zult ook het formulier een naam moeten geven. Zet wat tekst in het vakje, en klik op het plaatje.

<FORM NAME="theform">
<INPUT>
<A HREF="javascript:document.theform.reset()">
<IMG SRC="button.gif" ALT="Reset"></A>
</FORM>

Reset
bottom  
left Copyright © Gerben Hoekstra - Alle rechten voorbehouden backnext right