Multiplle rollover images, image map and all that messy complicated stuff

[gmariusica]

Hello

Couple of weeks ago I finished my personal website: www.gmariusica.com, I know that are many things to improve to it but it's my first done ever and now I'm learning.

Why I'm here? Because I got stuck at the homepage with some “image map - rollover images” and I would like a little bit of help.
So… I split the homepage photo in many squares and I want a bigger thumbnail size when I go rollover it.
I read some of the image map, image rollover, multiple image rollover tutorials but none of them seems to work properly, I applied some of the tutorials and the project came close to what I want but I have done a real mess and still nothing ran smooth and properly.
My request…if someone knows a proper tutorial for what I want to do (please give me a link) or some proper directions to not wandering around from tutorial to another tutorial for hours and hours. I know that probably I supposed to start reading a JavaScript book or something but that will be a huge time consuming for me as a non webmaster.

Thank you for your support and for your time reading my thread.

Marius.

[tirna]

All the photos on your home page are in 1 image which imo would make your image map cumbersome to maintain if you plan to make frequent changes.

Imo an easier to maintain layout would be to have each photo in a separate container while still having the same effect you have with 1 image. You could then have onmouseover and onmouseout functions to display your enlarged photos as users rollover an image.

But if you really want to use an image map
this w3schools tutorial with example code (http://www.w3schools.com/js/js_image_maps.asp) will show how to do what you want. In the tute, you can replace the writeText() with your own code to display the enlargement image in a pop-up, another div or whatever you like.

[gmariusica]

Thank you tirna. I think your first idea makes sens to me and I will try to see how it looks like and I will have a look over your link too.
Thank you one more time.