1

地域をポイントすると、ボックスに情報がポップアップ表示されるマップを作成しました。

Safari と Chrome では動作しますが、Firefox や Internet Explorer では動作しません (見たい場合は samtranum.com/border-barriers にあります)。

以下のコードを Firefox と IE でも動作させるにはどうすればよいですか?

Javascript: 

function showTooltip(div, title, desc) {
  var left = event.pageX - 200 + 'px'; 
  var top = event.pageY - 700 + 'px';
  div.style.display = 'inline';
  div.style.position = 'absolute';
  div.style.width = '200px';
  div.style.top = top;
  div.style.left = left;
  div.style.backgroundColor = 'white';
  div.style.border = 'solid 1px black';
  div.style.padding = '10px';
  div.innerHTML = '<b>' + title + '</b> <div style="padding-left:10; padding-right:5">' +     desc + '</div>';
} 
function hideTooltip(div) {
  div.style.display = 'none';
}

HTML:

<body> 
   <div style="display:none" id="t1"></div>

  <img src="http://static.squarespace.com/static/516faf88e4b03f8eb2807350/t/519f3bdee4b05327e360c53d/1369390047458/Borders_Map1.jpg" width="472" height="859" usemap="#bordermap"/>

<map name="bordermap">

<area shape="poly" coords="190,321,194,323,199,322,207,328,202,339,216,341,211,352,227,338,217,333,212,330,210,325,205,321,201,318" onMouseOut="hideTooltip(t1)" onMouseOver="showTooltip(t1, 'Central America', 'There is a barrier between Cuba and the American enclave in Guantanamo Bay, and there have been proposals for Belize-Guatemala and Costa-Rica-Nicaragua barriers.')">

など。ここから先は、各地域で同じです。

4

1 に答える 1

1 
function showTooltip(id, title, desc) {
  var left = event.pageX - 200 + 'px',
      top = event.pageY - 700 + 'px',
      div = document.getElementById('t1');
  div.style.display = 'inline';
...
}

これを試してください（ も同じhide_tooltip）

于 2013-05-27T14:02:21.407 に答える