Er zijn een viertal elementen nodig om dit te laten werken:
- Het script:
<script type="text/javascript">
function kadabra(zap) {
if (document.getElementById) {
var abra = document.getElementById(zap).style;
if (abra.display == "block") {
abra.display = "none";
} else {
abra.display= "block";
}
return false;
} else {
return true;
}
}
</script>
(te plaatsen in de head) - Style script:
<style type="text/css">
#tekst {
display: none;
width: 250px;
border: 1px solid black;
background-color: #cccccc;
padding: 5px;
font-size: 12px;
}
</style> (ook plaatsen in de head) - Tekst die open moet klappen (zelf schrijven) en die vervolgens plaatsen tussen:
<p id="tekst">
</p> (de verwijzing "tekst" kan natuurlijk aangepast worden en dan moet die vervolgens ook aangepast worden binnen het style script en de link hieronder.) - Een link waarop geklikt moet worden om de tekst uit 3) zichtbaar en onzichtbaar te maken:
<a href="#" onclick="return kadabra('tekst');"> Hier de link naar je tekst die zichtbaar is voor je bezoekers en waar ze op moeten klikken om de tekst uit 3) te kunnen zien.</a>
En illustraties / pictures / images / foto's? Dat werkt op dezelfde manier. Alleen onder 3) een verwijzing naar een image bestand plaatsen in plaats van tekst. Maar wat betreft images en foto's raad ik toch echt lightbox aan.
Groeten,
Meindert (dewebmeester.nl)
(wordt vervolgt)
