拜托，帮助......我做了这个（我在jquery和javascript中全新），但我的工具提示隐藏并且不在使用mouseout，我需要用户与它进行交互，我需要（很难）显示内容（以及指向iframe或类似内容的链接）来自我自己创建的地图（国家/地区）区域内的区域，这是我的代码：
(function($){ $('.tooltip').hide('show');
$('div.area-tip').mouseover(function(e){
tip = $(this).attr('id');
tip = tip.substring(tip.indexOf('-')+1);
cursorX = e.pageX;
cursorY = e.pageY;
$('div[id='+tip+']').css('top',cursorY);
$('div[id='+tip+']').css('left',cursorX);
//$('div[id='+tip+']').show('delay: 400');
// $('div[id='+tip+']').hide('fixed');
});
$('tooltip').mouseout(function(){
find('div-area-tip').stop(true,false).animate({opacity:'show', left:'-100px'}, 30);
});
})(jQuery);
/ ********* \
<body>
<p>mi mapa </p>
<div id="map_cub">
<img src="images/Map_de_cuba-v2.png" alt="Cuba" width="700" height="284" usemap="#Map">
<map name="Map">
<div id="area-1" class="area-tip"><area shape="poly" coords="125,50,143,82,35,116,84,67" href="#" target="_self" alt="Pinar del Rio">
<div class="tooltip" id="1">
<p class="p">pinar</p>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat.</p>
</div>
</div>
<area shape="poly" class="area-tip" id="area-2" coords="130,44,130,45,128,46,147,75,185,64,174,40" href="#" target="_self" alt="Artemisa">
<area shape="poly" class="area-tip" coords="195,30,176,39,187,48,203,35" href="#" alt="La Habana">
<area shape="poly" class="area-tip" coords="205,33,201,42,187,50,187,64,223,71,226,58,222,43,223,36" href="#" target="_self" alt="Mayabeque">
<area shape="poly" class="area-tip" coords="231,36,229,62,225,74,195,82,217,96,244,103,261,103,267,80,286,68,273,42,252,35" href="#" target="_self" alt="Matanzas">
<area shape="poly" class="area-tip" coords="289,46,287,56,291,72,309,75,316,93,322,109,333,99,356,85,329,57" href="#" target="_self" alt="Villa Clara">
<area shape="poly" class="area-tip" coords="291,74,283,80,273,80,271,97,289,101,299,109,313,118,319,111,309,79" href="#" target="_self" alt="Cienfuegos">
<area shape="poly" class="area-tip" coords="380,87,360,87,353,95,341,100,335,105,320,115,316,123,345,134,357,136,374,138,372,109" href="#" target="_self" alt="Sancti Spiritus">
<area shape="poly" class="area-tip" coords="393,87,383,87,378,103,382,113,379,128,389,135,401,139,420,123,423,112,433,107" href="#" target="_self" alt="Ciego de Avila">
<area shape="poly" class="area-tip" coords="433,108,430,120,428,125,419,130,410,135,402,141,408,160,410,173,433,190,448,193,466,174,479,172,490,157,490,143" href="#" target="_self" alt="Camaguey">
<area shape="poly" class="area-tip" coords="498,148,493,159,488,168,478,174,466,177,457,189,464,192,478,191,486,187,506,187,512,187,520,173,534,163" href="#" target="_self" alt="Las Tunas">
<area shape="poly" class="area-tip" coords="486,189,488,201,494,210,490,218,469,229,463,237,456,248,474,247,491,242,505,235,518,235,533,231,544,218,546,207,524,193" href="#" target="_self" alt="Granma">
<area shape="poly" class="area-tip" coords="543,160,536,168,530,172,524,175,518,186,546,202,560,201,591,199,610,202,630,207,631,196,583,189,573,180,582,180,583,170,570,165" href="#" target="_self" alt="Holguin">
<area shape="poly" class="area-tip" coords="554,206,547,218,545,225,539,231,531,235,528,240,542,239,556,239,571,238,583,242,592,244,590,235,594,224,593,213,593,204" href="#" target="_self" alt="Santiago de Cuba">
<div id="area-2" class="area-tip"><area shape="poly" coords="634,200,630,206,623,207,615,206,607,204,596,204,594,213,594,225,593,232,597,236,604,237,615,232,621,236,631,228,661,227,665,214,650,212" target="_self" alt="Guantanamo"/>
<div class="tooltip" id="2">
<p>guantanamo</p>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.</p>
</div>
</div>
<area id="area-15" shape="poly" class="area-tip" coords="152,110,140,121,145,135,152,144,172,135,165,117" href="#" target="_self" alt="Isla de la Juventud">
</map>
</div>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.area-tip.min.js"></script>
<script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="js/main.js"></script>
</body>
</html>
********** /