2014-02-23 40 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] 
相關問題