Javascript kalender met ma. beginnen en za. en zo. incl. data een afwijkend kleurtje

Status
Niet open voor verdere reacties.
L

Lavendel

Gebruiker
Lid geworden
3 apr 2012
Berichten
19
Hoi,

Ik heb op een webpagina een simpel kalendertje staan:
1. Deze kalender begint echter met zondag en ik wil de kalender op maandag laten beginnen en daar natuurlijk de juiste data bij.
2. De weekenden wil ik, dus ook de za. en zo. en bijbehorende data een afwijkend kleurtje geven bijv. licht grijs.

Bijgevoegd heb ik de html-pagina gevoegd. Voor het gemak heb ik het javascript bestand en het CSS bestand maar even in de HTMLpagina geplakt.

Kan iemand mij zeggen hoe ik bovenstaande 2 vragen kan oplossen? Bij voorbaat dank voor de genomen moeite.Bekijk bijlage Kalender_vb1.rar
 
Hoi Lavendel,
Deze komt wel een eind in de richting denk ik:

  • Test: kalender-nw.htm
  • Voor controle op juiste begin en eind v/d maand nog twee maanden toegevoegd.
  • Alleen als de 1e dag van de maand een zaterdag is, wordt deze niet uitgegrijsd (ik zie niet zo gauw waarom niet).
  • De css is zoals het hoort naar de <head> verplaatst.
Verder lijkt het een nogal ouderwets javascript, dat zou denkelijk mooier kunnen.
En er zitten er nog wat schoonheidsfouten in de html (een Doctype Transitional en Vreselijk Verboden Voorwerpen): die zaten er al in. ;)
Met vriendelijke groet,
CSShunter
 
CSShunter, heel erg bedankt voor je reactie. Ik ga er direct mee aan de slag. Mocht ik er niet uit komen dan hoop ik dat je mij nog wat hulp kan bieden, maar voorlopig puzzel ik eerst even verder. Ook ga ik eens kijken bij de vreselijk verboden voorwerpen.
Met vriendelijke groet,
Lavendel
 
Ook de dagaanduiding gekleurd

CSS-hunter je hebt me geweldig geholpen. Ik probeer nu echter bovenaan in de kalender de woordjes 'Za' en 'Zo' ook in een kleurtje te krijgen. De grijze hokjes vind ik te overheersend, dus heb ik gekozen voor een gele kleur. Maar hoe nu de za en zo ook in die kleur te krijgen? Bij voorbaat dank voor je reactie. En mocht de kalender beter en nog mooier kunnen dan houd ik me aanbevolen.Bekijk bijlage kalender-nw5.rar
 
De Za en de Zo kunnen ingekleurd worden door de regels 140 en 141 ...:
HTML: 
if(weekday == index)
WriteCal += '<td bgcolor="#FFFFFF" align="center" class="calday">' + DayOfWeek[index] + '</span>' + TdEnd;
... te vervangen door:
HTML: 
if(index==5 || index==6)
WriteCal += '<td bgcolor="#FFFFFF" align="center" class="calday zazo">' + DayOfWeek[index] + TdEnd;
... en dan het klasje .zazo in de css te zetten:
Code: 
.zazo {
	color: #CF0;
	}
O ja, en als je in de css ook het ene regeltje:
Code: 
.calendar td {
	text-align: center;
	}
... zet, dan kan je alle align="center" 's uit het javascript schrappen.
En in één moeite door: ook alle bgcolor="#FFFFFF" 's kunnen uit het script verwijderd worden, want die doen toch voor spek & bonen mee; en het moest niet wit maar blauw zijn... *)
- Dan zijn dan meteen een stuk of 15 Vreselijk Verboden Voorwerpen weggekieperd (en kortere code).

Ziezo! :)
Met vriendelijke groet,
CSShunter
__________
*) Gelukkig wint de goede blauwe background-color in de css het van die foute witte bgcolor in de html, anders werden het mooie witte letters op een prachtige witte achtergrond. :D
 
Laatst bewerkt:
CSShunter heel veel dank voor je reactie en hulp. Ik voel me wel steeds kleiner worden bij zo'n deskundige. Ja het klopt dat ik niet alle CSS zaken goed weet te managen. Het blijft moeilijk voor mij. Maar op jouw website heb ik heel veel informatie gezien die ik nog moet verwerken. Fijn dat je me zo geholpen hebt. Ik zal de zaakjes aanpassen zoals jij voorstelt.

Met vriendelijke groet,
Lavendel
 
Status
Niet open voor verdere reacties.
Steun Ons

Nieuwste berichten

Terug
Bovenaan Onderaan