2014-02-23 39 views
0

我试图制作图像地图,我需要在鼠标悬停上显示的工具提示。该html代码如下所示。标题上的图像地图区域工具提示

`<div id="harta"> 
<img src="/templates/it_thecity/images/map.png" width="620" height="310" class="map" border="0" usemap="#shqiperia" /> 
<map name="shqiperia" id="shqiperia"> 
<area shape="poly" coords="266,69,260,74,260,82,255,90,251,97,246,98,246,104,240,103,239,107,240,113,237,116,239,121,243,121,248,123,251,120,252,114,256,115,260,117,263,114,263,109,263,105,265,104,268,104,269,100,271,96,272,91,270,89,267,81,267,75,266,69" href="#" target="_self" alt="Shkodra" title="Shkodër (3)" class="sh masterTooltip" data-maphilight='{"groupBy":".sh"}'/> 
<area shape="rect" coords="44,56,122,76" href="#" alt="Shkodër" class="sh masterTooltip" data-maphilight='{"groupBy":".sh","fill":false, "stroke":false}' title="3 Universitete" /> 
</div>` 

而且我有从模块中我的网站的JavaScript代码,显示上的其他元素不是图像映射中的某些工具提示。

`<script type="text/javascript"> 
    window.addEvent('domready', function() { 
     $$('.hasTip').each(function(el) { 
      var title = el.get('title'); 
      if (title) { 
       var parts = title.split('::', 2); 
       el.store('tip:title', parts[0]); 
       el.store('tip:text', parts[1]); 
      } 
     }); 
     var JTooltips = new Tips($$('.hasTip'), { fixed: false}); 
    }); 

    (function() { 
     var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true; 
     po.src = 'https://apis.google.com/js/plusone.js'; 
     var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s); 
    })(); 
    </script>` 

如何使一个工具提示出现在鼠标悬停在area元素?

回答

0

解决这个问题,前段时间但忘了把对答案。 这里是解决方案:

[http://jsfiddle.net/ove4trwa/4/][1] 
相关问题