- In een db sla je gegevens op over de locatie van de persoon op de foto.
Een koppeltabel groepsfoto_personen of zo.
Daarin zet je (naast de referentie naar de foto en naar de persoon), uitgedrukt in pixel: top, right, bottom, left => die overeen komen met de locatie van het hoofd (je moet die velden wel anders noemen; er zitten gereserveerde woorden tussen).
- Je zet in javascript een array met alle rechthoeken waar hoofden staan. Telkens, bij elk rechthoek moet ook de id van de persoon staan.
- Dan is het kwestie van het detecteren van de muis-positie over een element. Je vergelijkt die met die array; leest de id.
- Met die id doe je een Ajax request, die de gegevens van die persoon ophaalt.
Eventueel kan je die gegevens ook al naar de gebruiker sturen bij het verzoek van de pagina. Je steekt die bv. in div's met display: none
Dan heb je geen verbinding met de server meer nodig.
- en dan nog wat prutsen met css om die popup goed te positioneren