dinsdag 23 augustus 2011

Klikbaar plaatje laat iets anders zien

Onderstaand plaatje is klikbaar en dan opent zich een ander plaatje. Om dit gedaan te krijgen heb ik eerst de twee afbeeldingen naar het Gruis-fotoalbum in PicasaWeb gezet, of een plaatje aldaar met Picnik online bewerkt en als kopie in het zelfde album laten plaatsen. Vervolgens heb ik beide plaatjes in het bericht geplaatst. Het plaatje dat zichtbaar is heeft de image-tag (en de onderliggende bronvermelding). De link van het het plaatje dat verschijnt na het klikken, kopieer ik en plak in de a-tag van het zichtbare plaatje. Het onderstaande plaatje verwijder ik uit het bericht; dit had ik alleen nodig om de link te achterhalen. Het werkt als een tierelier en leuk verrassend

Strepen aan de hemel
<a href="url_van_de_afbeelding_die_gaat_verschijnen_na_aanklikken_van_het_zichtbare_plaatje" title="De strepen aan de hemel, in de vroege ochtend boven het BovenIJ ziekenhuis">
<img src="url_van_het_zichtbare_plaatje" alt="Strepen aan de hemel" title="Strepen aan de hemel">
<a>
Wanneer je met de cursor over de afbeelding zweeft, krijg je een ballonnetje te zien met tekst. Deze tekst staat in een alt en een title attribuut van de img-tag: alt is voor Internet Explorer, title is voor de andere browsers.
Het plaatje dat verschijnt na klikken en dat opkomt met een Lightbox, bevat een onderschrift. Deze tekst staat als title in de a-tag.

Geen opmerkingen:

Een reactie plaatsen