Ja het is wel voor mezelf (moet er tenslotte iets van leren).
De opdracht:
Opdracht 2 – Rubrieken, items en menu’s
Gegeven wordt de structuur en informatie van Icacatoo voor een rubriek,
de items hierin en de menu’s die hierbij horen (deze informatie staat in het
bestand data.xml). De vraag is om hiervan een XHTML bestand te maken
voor de structuur en inhoud, en een CSS bestand voor de opmaak. Zorg
ervoor dat de XHTML code betekenisvol is zodat zelfs zonder CSS de
structuur duidelijk is.
Voeg vervolgens CSS toe om de volgende visuele effecten te bereiken:
- Als je met de muis boven een rubriek zweeft, verandert de kleur en
worden de menu’s van de rubriek getoond (zie figuur 5).
- Als je met de muis boven een item zweeft, dan veranderd de kleur van
de titel, de auteur en de datum, de achtergrondkleur van het gehele
item, en de menu’s van het item worden getoond (zie figuur 6).
Tevens wordt de gehele rubriek veranderd zoals bij het punt hierboven
beschreven.
- En als laatste worden natuurlijk de menu’s getoond als je met de muis
over de menuknop zweeft (zie figuur 7).
Belangrijk
Voor de hele opdracht geldt: geen JavaScript gebruiken!
Tip: Om betekenisvolle XHTML te gebruiken probeer je waar mogelijk een
tag met semantiek te gebruiken, in plaats van een nietszeggende <div> of
<span>. Wellicht kun je de lijst met tags nog eens nakijken op
http://www.w3schools.com/tags/default.asp. Uiteraard mag je de <div> en
<span> tags wel gebruiken, maar realiseer je goed waar ze voor bedoeld
zijn: het groeperen en/of omvatten van een aantal tags.
Als je toch besluit – of geen andere keuze hebt – om <div> en <span> tags
te gebruiken, zorg er dan minimaal voor dat ze een class attribuut hebben
waarmee de betekenis verduidelijkt wordt.
