4-maands kalender
In bedrijven en kantoren zie je ze vaak aan de muur hangen: Een kalender die vier maanden toont. Dat wil zeggen:
De vorige maand, de huidige maand en de twee komende maanden. Als je thuis bent of als je op kantoor er geen een tot
je beschikking hebt, kun je deze gebruiken.
Op deze bladzijde wordt een script gepresenteerd dat zo'n kalender op het beeldscherm van je PC laat zien.
Druk op de knop hieronder voor een voorbeeld.
De 4-maands kalender markeert de algemeen erkende christelijke en seculiere feest- en gedenkdagen.
De code staat onderaan de bladzijde. Je kunt hem downloaden om zelf de gebruiken.
- Er worden twee items besproken:
- Inbouwen in je eigen site
- Werking van het script
- Dit script is een speciale versie van het item Jaarkalender.
- De code van de kalender staat in de file maandenkal.js. Hierin moet je inhoud van de <title>tag
aanpassen voor je eigen doeleinden, in de regel:
var t = "<html><head><title>Ben's Hobbyhoekje --
Verder hoeft er niets te worden veranderd, tenzij je feestdagen wilt toevoegen of verwijderen.
4-Maands Kalender</title><style>" - De kalender wordt op het scherm gezet door de functie ma4k(richting) aan te roepen.
De parameter richting geeft de opbouw van de kalender aan. Mogelijk waarde zijn 'horizontaal'
en 'verticaal'. Die waarden spreken voor zich.
Als richting een verkeerde waarde heeft of leeg wordt gelaten, wordt verticaal genomen.
In het voorbeeld is 'horizontaal' gebruikt. De kalender verschijnt in een popup.
Klik HIER als je de verticale uitvoering van de kalender wilt zien. - De normale werkwijze op deze site is dat een popup door een bladzijde wordt gemaakt, waarna er een HTML-code in wordt gezet. Bij deze kalender wordt daar van af geweken: Het popup-window wordt eerst door de function ma4k() zelf gemaakt, waarna ma4k() de inhoud genereert.
- Deze aanpak vereist dat ma4k() door de gebruiker wordt geactiveerd. Dat kan met behulp van een button, zoals op deze bladzijde.
- Het is mogelijk om ma4k() zonder tussenkomst van de gebruiker, dus direct vanuit de HTML-code, aan
te roepen. Als je dat doet zal de popup-blocker proberen de kalender tegen te houden. Ik raad dat dus niet aan.
Het is wel mogelijk om de hele 4-maands kalender direct in je document te plaatsen. Zie daarvoor de items 4-maands kalender IIa: Horizontaal en 4-maands kalender IIb: Verticaal.
- De meeste browsers openen de popup in een eigen venster. Het kan ook in een nieuw tabblad. Dat hangt af van de instellingen
van de browser.
- Zonder in detail te treden is de werking van het script als volgt:
- Eerst worden het huidige jaartal en de huidige maand bepaald, aan de hand van de systeemklok. Daaruit wordt bepaald welke vier maanden in de kalender moeten komen (vorige, huidige, twee volgende).
- Voor de gemarkeerde data worden aparte classes gebruikt, die door het script zelf worden ingesteld. Een apart style-sheet is dus niet nodig.
- Vervolgens wordt voor elk van de vier maanden een maandkalender gemaakt, waarbij de markeringen voor de feestdagen worden verwerkt.
- De datum van Vandaag overschrijft de markering van een feestdag.
- Voor de berekening van de Paaszondag en voor het toevoegen van feestdagen aan de kalender, wordt verwezen naar het item Jaarkalender.
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>).
<script src="maandenkal.js"></script>
(Zet dit in de <BODY>, op de plaats waar je het nodig hebt. Dit is de code van een knop zoals op deze bladzijde).
<button name="KalenderHorizontaal" onclick="ma4k('horizontaal')">4-maanden kalender</button>
Downloaden:
Druk op de knop:
File: voorb273.zip, 2753 bytes.
Opmerking:
Een versie die het hele jaar toont is ook beschikbaar. Zie het item Jaarkalender.
Er is ook een versie van deze 4-maands kalender met weeknummers. Zie 4-maands kalender:
versie met weeknummers.
