onLoad De load gebeurtenis treedt op als de browser een document in een venster of frame heeft geladen, of alle frames in een frameset.
onUnload De unload gebeurtenis treedt op als de browser een document uit een venster of frame heeft verwijderd.
onScroll De scroll gebeurtenis treedt op als het scrollwieltje van de muis wordt gebruikt.
onKeydown De keydown gebeurtenis treedt op als een toets van het toetsenbord ingedrukt wordt boven een element is.
onKeyPress De keypress gebeurtenis treedt op als een toets van het toetsenbord ingedrukt en weer losgelaten wordt boven een element is.
onKeyUp De keyup gebeurtenis treedt op als een toets van het toetsenbord ingedrukt wordt boven een element is.
onClick De click gebeurtenis treedt op als de gebruiker met de muis op een element klikt.
onDblClick De dblclick gebeurtenis treedt op als de gebruiker met de muis op een element dubbelklikt.
onMouseUp De mouseup gebeurtenis treedt op als de ingedrukte muisknop boven een element wordt losgelaten.
onMouseDown De mousedown gebeurtenis treedt op als de muisknop boven een element wordt ingedrukt.
onMouseMove De mousemove gebeurtenis treedt op als de muisaanwijzer verplaatst wordt, terwijl deze boven een element is.
onMouseOut De mouseout gebeurtenis treedt op als de muisaanwijzer van een element af wordt geschoven.
onMouseOver De mouseover gebeurtenis treedt op als de muisaanwijzer boven een element wordt geschoven.
onReset De reset gebeurtenis treedt op als de beginwaarden van de verschillende controls van een formulier worden hersteld.
onSelect De select gebeurtenis treedt op als de gebruiker tekst in een formulier tekstveld of meerregelig tekstveld selecteert.
onSubmit De submit gebeurtenis treedt op als de gegevens van een formulier worden verstuurd.
onFocus De focus gebeurtenis treedt op als een element de focus krijgt, bijvoorbeeld als gevolg van het gebruik van de tab-toets.
onBlur De blur gebeurtenis treedt op als een element de focus verliest, bijvoorbeeld als gevolg van het gebruik van de tab-toets.
onChange De change gebeurtenis treedt op als de waarde van een control is veranderd.
Inleiding
Ontwerp handleiding WB5 en uitwerking: Nanno Koerts (http://kiektoestel.nl)
Ontwikkelaar WB5: Pablo van der Meer (http://www.pablosoftwaresolutions.nl)

© 2007-2008 by Pablo Software Solutions
Deze pagina werd keer bekeken.
WYSIWYG Web Builder 5
Pablo Software Solutions
Events zijn gebeurtenissen die je kan gebruiken om te activeren wanneer je dat later wilt (laten) doen dan bij de eerste weergave van je pagina.
Te denken valt aan een Mouseover en/of Mouseout effect.
Dit wil zeggen dat er iets moet gaan gebeuren wanneer de bezoeker van je pagina met de muis ergens op gaat staan.

Plaats je muis op deze tekst voor een voorbeeld!
We gaan in deze workshop het bovenstaande voorbeeld uitwerken. Een event gebruik bij een tekstlink. Eerst even de uitleg van wat de events kunnen doen.
Welke Event en wat doet deze..
Hieronder ziet u het totale overzicht van alle events die binnen Web Builder gebruikt kunnen worden.
NOTE: Per tool is het dus verschillend welke events je kan gebruiken.
 
Voorbeeld met een Tekstlink event
Bij de tekstlink kunnen 12 verschillende events worden gebruikt.

We gaan een tekstlink maken met een tekstballon erboven als je er met je muis op gaat staan.

Hiervoor hebben we de 'onMouseover' en de 'onMouseout' nodig als event.
Naast deze events een afbeelding (de tekstballon) en natuurlijk de tekst.
 
Stap 1
Plaats op je pagina een tekstvak en type je tekst.

Stap 2
Plaats een vorm op je werkblad.
Selecteer bij 'Vorm Soort' de Talk Bubble en kies de gewenste Bubble.
Geef het de voor jou gewenste kleuren bij 'Vul effecten' en 'Randen' en geef een schaduwwaarde in als je dat wenst.

Deze instellingen hebben wij gebruikt:
Klik op het tabblad 'Tekst'.
Voer de tekst in die je in de ballon wilt laten verschijnen. De opmaak is geheel aan jezelf.
Maak nog even de keuze waar je de tekst wilt laten verschijnen bij 'alignment' en klik op OK.
Pas het formaat nog even aan en plaats de vorm daar waar je hem wilt laten zien.
Plaats hier de professor onder.

In de Eigenschappen Inspecteur [Menubalk > Beeld > Eigenschappen] kan je de ballon en de professor een ander ID naam geven door het object te selecteren en op de ID naam te klikken en te typen.

Stap 3
Je hebt nu de ObjectManager nodig. Deze kan je activeren via [Menubalk > Beeld > ObjectManager].
In de ObjectManager zie je nu al je objecten staan.
Klik bij 'Zichtbaar' op het v-tje om beide objecten onzichtbaar te maken.

Stap 4
We gaan de tekstlink maken.
Selecteer de gewenste tekst en open de link eigenschappen [Menubalk > Invoegen > Link (Ctrl+K)].
Bepaal zelf de gewenste link waar je hem voor wilt gebruiken. Als je geen verwijzing naar een andere pagina of website wilt, sla je dit over.
Klik op het tabblad 'Events' en klik op 'Toevoegen'.
Selecteer bij Event: onMouseover, laat bij Actie: Show staan en kies bij Doel: Professor.
Klik op OK

Voeg nog een nieuwe event toe:
Selecteer bij Event: onMouseout, selecteer bij Actie: Hide en kies bij Doel: Professor.
Klik op OK

Voeg nog een nieuwe event toe:
Selecteer bij Event: onMouseover, laat bij Actie: Show staan en kies bij Doel: Tekstballon.
Klik op OK

Voeg nog een nieuwe event toe:
Selecteer bij Event: onMouseout, selecteer bij Actie: Hide en kies bij Doel: Tekstballon.
Klik op OK

Als je dit hebt uitgevoerd, zal je dit resultaat zien:
Stap 5
Klik op OK.

We zijn klaar, dus kunnen we de boel gaan publiceren.
Je kan het resultaat ook bekijken in de Preview-mode (F5).

Dit is het einde van deze workshop. Natuurlijk is er veel meer te doen met de events. We hebben slechts een voorbeeld gegeven van een 'onMouseover' en een 'onMouseout' effect.

Wilt u nog zo vriendelijk zijn uw reactie hieronder te schrijven? Bedankt!
Er is veel meer mogelijk met deze events en ze zijn bij de meeste Tools te gebruiken.
Dus niet bij alle Tools.

Je kan een Event toevoegen via het tabblad 'Events' bij de eigenschappen (Alt-Enter) van het object.

Zo kan uw venster er dan uit zien (plaats je muis op het pijltje om uit te klappen):