Wat is jQuery?

jquerySoms zijn er zaken die het leven van een websitebouwer gemakkelijker kunnen maken. Soms moet je daar voor betalen, maar soms is het helemaal voor niets. jQuery is zo’n gratis initiatief wat een hoop gemak geeft als je veel met JavaScript werkt. jQuery is een Javascript bibliotheek die het maken van applicaties vereenvoudigt tot het niveau van werken met CSS. Nou dat klinkt aantrekkelijk toch?

Sites als Google, WordPress, Digg, Dell en Technorati hebben jQuery geadopteerd als manier om hun scripts te laten werken. Het moet dan ook wel voordelen hebben. Om jQuery op jouw site te laten werken heb je het basis bestand nodig. Dit basisbestand sla je op in een map van je website en vanaf je webpagina moet je naar dit bestand linken. Dat doe je over het algemeen als volgt:

  <html>
  <head>
    <script type="text/javascript" src="jquery.js"></script>
    <script type="text/javascript">
      // Hier komt de code
    </script>
  </head>
  <body>
    <a href="http://localhost:8888/">html-site</a>
  </body>
  </html>

Zoals je ziet heet dit basisbestand jquery.js. Dit bestand wordt gebruikt als een soort wrapper. Dit bestand zorgt er voor dat acties worden uitgevoerd en dat je voor deze acties geen uitgebreide code meer hoeft te schrijven, deze code staat namelijk al in jquery.js. Het voordeel van jQuery is, dat het geschikt is voor alle hedendaagse browsers en ook klaar is voor CSS 3. Een voorbeeld dan maar.

CSS classes toevoegen en verwijderen

Je kunt met jQuery classes in CSS toevoegen of verwijderen. De volgende css code voeg je toe aan je html-document:


Nu voeg je de volgende code toe aan je script:
$("a").addClass("test");
Alle ‘a’ elementen worden nu vet weergegeven.
Voor het verwijderen gebruik je de volgende code:
$("a").removeClass("test");

Code om een link langzaam te laten verdwijnen.

Nog een eenvoudige code om een link langzaam te laten verdwijnen:
$("a").click(function(event){
event.preventDefault();
$(this).hide("slow");
});

Uitproberen?
Binnenkort meer over nuttige toepassingen van jQuery.

Een reactie achterlaten

Het e-mailadres wordt niet gepubliceerd. Verplichte velden zijn gemarkeerd met *