Gérer plusieurs Map Area

Bonjour à tous,

Je suis assez débutant en JS, et j'ai déjà mis un peu de temps à réaliser une map area tout bête, avec l'affichage d'une image différente lors du mouseover et du onClick. Voici le lien test de mon projet : http://test.duude.fr/building/index2.html# .

Mon problème principal est que lors du onClick, l'image affichée alors ne l'est que dans la zone de l'area. Or je voudrais qu'elle remplace totalement l'image précédente pour créer dessus de nouvelles area, qui elle-même auraient d'autres mouseover et d'autres onClick. J'imagine donc qu'il faut que j'utilise de l'ajax, si je veux garder un système pour ne pas rafraichir la page ?

J'ai deux petites questions complémentaires :

-Est-il possible de créer une petite animation lors du mouseover? (par exemple l'affichage progressif de l'infobulle, ou une div qui arriverait par en haut ou le côté?)

-Dans ma méthode, mes images ne sont pas pré-chargées, du coup il y a un petit temps de latence dans l'affichage des images lors du premier survol, j'imagine qu'il faudrait donc que je change de script/méthode ?

Merci d'avance pour votre aide :)