Schijngestalte van de Maan
Weerberichten zijn heel populair op internet. Dat is op zich niet vreemd, want westerlingen praten heel veel over het weer. Websites waarop weerberichten staan worden vaak "aangekleed" met andere zaken die met weer te maken hebben, zoals een plaatje van de stand van de maan. Deze website is daarop geen uitzondering. Hieronder zie je een voorbeeld van hoe dat er uit zou kunnen zien.
Maanstand:
|
Schijngestalte van de Maan
|
Op deze bladzijde wordt beschreven hoe je het aan kunt pakken om zelf zo'n maanstand-kalender op je
site te zetten. De code heb ik zelf ontwikkeld, gebaseerd op voorbeelden van wunderground.com en www.24fun.com. Deze laatste site is opgeheven.
De plaatjes zijn afkomstig van een oude versie van wunderground.com.
De code staat onderaan deze bladzijde. Je kunt hem ook downloaden, samen met de noodzakelijke plaatjes.
- Er worden drie items besproken:
- Het plaatje van de maanstand in de webpagina opnemen.
- De begeleidende tekst erbij laten zetten.
- De globale werking van het script.
- Het rekenprogramma zit in de file maanklok.js. Als je alleen het plaatje van de maanstand op je
webpagina wilt zetten hoef je deze file niet te veranderen; eventueel kun je de begeleidende tekst wijzigen.
- Voor de weergave op deze bladzijde is een <table> gebruikt. Voor deze toepassing is dat handig, omdat de lay-out dan heel eenvoudig wordt. Nodig is het niet.
- Het plaatje van de maanstand heeft zowel een name als een id, die aan elkaar gelijk zijn: name="maanstand" en id="maanstand". Hiermee wordt bereikt dat het ook met wat oudere browsers werkt. Voor gebruik met moderne browsers volstaat het id.
- De begeleidende tekst heeft de id="maantekst". Dat doe je met de tag:
<div id="maantekst">Schijngestalte van de Maan</div> .
Dit is de tekst die op deze pagina wordt gebruikt, maar in plaats van Schijngestalte van de Maan kun je alles neerzetten wat je wilt.
Als je de begeleidende tekst niet wilt gebruiken laat je de <div>-tags gewoon weg.
- De werking van het script is -zonder in details te treden- ongeveer als volgt:
- Het script bevat een datum in het verleden waarop het Nieuwe Maan is (de begindatum). Om onnauwkeurigheden
door (te grote) afrondingen te voorkomen dient het werkelijke tijdstip van Nieuwe Maan zo dicht mogelijk bij
0:00 uur te liggen.
Deze website gebruikt 7 juni 2005 om 00:00 uur. - Het aantal dagen dat is verstreken tussen vandaag en de begindatum wordt berekend.
- Dit wordt verminderd met het aantal verstreken maancycli sinds de begindatum. Na afronding blijft het
dagnummer binnen de huidige maancyclus over. Dit is een getal dat minstens 0 en hoogstens 30
is. Als het dagnummer groter is dan 29 wordt het op 0 gezet.
N.B.: Een volledige maancyclus is 29,530589 dagen. - Het plaatje dat hoort bij het dagnummer in de maancyclus vervangt het oorspronkelijke plaatje het scherm.
- Indien gewenst (dat wil zeggen: als er een blok code met id="maantekst" bestaat) wordt
de beschrijvende tekst (het dagnummer) erbij gezet.
Als dagnummer gelijk is aan 0 of 1, 8, 15 of 22 wordt een aangepaste tekst gebruikt (resp. "Nieuwe Maan"; "Eerste Kwartier"; "Volle Maan"; "Laatste Kwartier").
- Het script bevat een datum in het verleden waarop het Nieuwe Maan is (de begindatum). Om onnauwkeurigheden
door (te grote) afrondingen te voorkomen dient het werkelijke tijdstip van Nieuwe Maan zo dicht mogelijk bij
0:00 uur te liggen.
Opmerking:
Omdat de maan-cyclus 29,530589 dagen is, moet er worden afgerond om het volgnummer van de dag in de cyclus
te berekenen. Die afrondingen zorgen er voor dat het dag-nummer en de dag waarop Eerste kwartier, Volle maan, enz.
wordt weergegeven maximaal 1 dag naast de werkelijkheid kan zitten.
Een variant van deze code vind je in het item Schijngestalte van de Maan II: Tekening met JavaScript.
Gebruik:
- De code staat gedeeltelijk in de <HEAD> en gedeeltelijk in de <BODY>.
De code ziet er als volgt uit:
(Zet dit in de <HEAD>).
(Zet dit in de <BODY> voor het plaatje).<script src="maanklok.js"></script>
Merk op dat de <img>-tag zowel een name als een id heeft. Dit om de compatibiliteit met oudere browsers te waarborgen. Indien nodig en nuttig kun je hier nog andere attributen aan toevoegen, zoals style.<img id="maanstand" name="maanstand" src="dag0.gif" alt="" width="48" height="48">
(Zet dit in de <BODY> voor de tekst).
<div id="maantekst">Schijngestalte van de Maan</div>
Downloaden:
Druk op de knop:
File: voorb158.zip, 62 655 bytes.
