Using ‘hotspots’ to swap images is pretty straight forward, and can be really effective…. try this method from Stackoverflow
<img src="nav.jpg" /> //set off state var nav_off = "/images/nav-off.jpg"; // functions for over and off function over(image) { $("#main-nav").attr("src", image); } function off() { $("#main-nav").attr("src", nav_off); } $("#imagemap area").hover( function () { var button = $(this).attr("id"); over("/images/nav-" + button + ".jpg"); }, function () { off(); }); });
Main Category