Regnery.net Internet

HTML CSS PHP MYSQL JQuery SEO – internetoplossingen

Show Event

In de tweede tutorial heb je kennis gemaakt met het concept van Events. Een Event is een gebeurtenis waar jij als sitebouwer een specifieke actie aan koppelt. De enige actie tot nu toe was dat je iest liet verdwijnen als een bezoeker ergens op klikt. Maar JQuery heeft meer events, waaronder de Show Event.

Show Event

Het Show Event geeft aan dat je iets wilt laten zien. Dus bijvoorbeeld de paragraaf die je eerst hebt laten verdwijnen, wil je nu weer laten zien.

<!DOCTYPE html>
<html> <head>
<script src=”//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js”></script> <script>
$(document).ready(function(){
$(“#verberg”).click(function(){
$(“p”).hide();
});
$(“#toon”).click(function(){
$(“p”).show();
});
});
</script>
</head> <body>

<p>Paragraaf 01 – verbergen en laten zien via JQuery functie.</p>
<button id=”verberg”>Verberg tekst</button>
<button id=”toon”>Laat tekst zien</button>

</body> </html>

In dit voorbeeld maak je een stuk tekst waarin je de bezoeker van je pagina de optie geeft de tekst of weer te geven of te verbergen. De twee functies daarvoor zijn show(); en hide(); in JQuery.

Parameters functies hide en show

De functie hide(); en show(); hebben parameters waarmee je de functie nog specieker kunt maken. De eerste parameter betreft de snelheid waarmee je iets wilt laten zien of laten verdwijnen. De values daarvoor zijn slow, fast of in cijfers (waarbij het gaat om millisecondes).

$(“button”).click(function) {
$(“p”).hide(2000);
});

In dit geval heb je een snelheid meegegeven waarbinnen de tekts moet verdwijnen van de paragraaf. In 2000 millisecondes moet de tekst verdwijnen van je site.