/*
			Eerste enkele functies. De naam zegt zelf al wat ze doen.
			Voor alle duidelijkheid. Een functie is een blok code (in ons geval, een regeltje),
			die je (meestal) een naam geeft, en die je dus middels die naam
			herhaaldelijk kan aanroepen.
			*/
			
			function opennieuwsbrief(){
				$('#nieuwsbrief').animate(
					{							// de parameters die je aanpast. Je geeft telkens na de dubbelpunt het 'doel' op
						height: '50px',
						opacity: 1
					},
					400,						// aantal milliseconden dat de animatie mag duren
					'swing');					// animeer met een beetje easing.
			}
			
			function sluitnieuwsbrief(){
				$('#nieuwsbrief').animate(
					{
						height: '0px',
						opacity: 0
					}
					, 400
					);						// als je het easing argument weglaat, wordt automatisch
			}									// linear als 'mode' gekozen. Middels plugins kan je
												// nog een hoop andere easings gebruiken (boingboingboing...)

			/*
			wanneer de html volledig geparsed is, wordt de functie ready uitgevoerd.
			Hierin definieer je je events, in ons geval enkel 'click'.
			*/
			$(document).ready(function(){ 
				
				/*
				Wanneer op het element met de id 'open' geklikt wordt,
				voer je een functie uit.
				In die functie staat in dit geval de aanroep naar de functie 'opennieuwsbrief' (zie boven)
				*/
				        
				$("#open").click(
					function() {
						opennieuwsbrief();
					}
				);

				/*
				Zoals je ziet is het een eitje om dezelfde code nu aan te roepen vanaf een andere plaats,
				met een koppeling naar een andere knop.
				*/
				$("#nieuwsbriefboven").click(
					function() {
						opennieuwsbrief();
					}				
				);
				
				/*
				Ik veronderstel dat je de nieuwsbrief ook wil sluiten?
				*/
				$("#sluit").click(
					function() {
						sluitnieuwsbrief();
					}
				);
				
				/*
				Omdat ik de div transparant wil laten starten moet ik'm nu al onzichtbaar maken.
				Dat had ik ook in de CSS kunnen doen, alleen, 'opacity' wordt in elke browser
				anders gebruikt. jQuery 2 the rescue!
				*/
				
				$('#open').opacity = 0;

			});
						
			/*
			Bovenstaande code kan nog een beetje korter geschreven worden.
			Dat heb ik nu, vanwege didactische redenen, niet gedaan.
			Niettemin, stel dat je hetzelfde knopje wil gebruiken om een te openen en te sluiten,
			zoek dan eens 'toggle'.
			Ook de hide() en show() functie kunnen interessant zijn.

			Ik heb ze in dit geval bewust niet gebruikt,
			omdat je met animate alle parameters zelf kan kiezen.
			*/