有MAP标签的图片如何用Jquery加效果？

做一个网页，涉及到MAP和onMouseOver()。
初始有一张图片A，鼠标移动到图片上不同的部分，下面显示另外两张不同的图片B和C，然后B和C又要用MAP点击触发链接。
关键代码如下：<!--初始图片A-->
<map name="Map">
<area shape="poly" coords="36, 80, 35, 123, 137, 129, 135, 78" alt="Frozen Food Submenu"
href="#" onMouseOver="changeDisplay(1)"> <!--javascript-->
<area shape="poly" coords="165, 80, 165, 123, 256, 129, 255, 78" alt="Fresh Food Submenu"
href="#" onMouseOver="changeDisplay(2)"> <!--javascript-->
</map>javascript如下
function changeDisplay(type) {
            if (type == 1) {
                FrozenFood.style.visibility = "visible";
                FreshFood.style.visibility = "hidden";
            }            else if (type == 2) {
                FrozenFood.style.visibility = "hidden";
                FreshFood.style.visibility = "visible";
            }<!--图片B-->
<img id="FrozenFood" src="images/frozen-menu.png" border="0" usemap="#Map2" style="visibility: hidden;"
alt="Frozen Food Submenu" width="650px" class="submenu">
<map name="Map2">
                      内容省略
</map>
<!--图片C-->
<img id="FreshFood" src="images/fresh-menu.png" border="0" usemap="#Map3" style="visibility: hidden;"
alt="Fresh Food Submenu" width="650px" class="submenu">
<map name="Map3">
                      内容省略
</map>
我的问题是：我想在这个基础上，增加一个动态显示图片的效果，比如渐渐淡入淡出这样的。
我用过Jquery，但由于我的网页显示图片后还需要用到MAP，很难直接用现成的Jquery套用，我弄了很久也没有解决，
请问有没有好方法？