悬停在maphighlight.js中的文本

时间:2017-11-05 16:52:07

标签: javascript jquery html css maphilight

有一个用于突出显示区域maphighlight.js的脚本。 一般来说,一切都有效,但我需要以某种方式这样做,以便当你悬停时,文本也会出现。 不幸的是,图像不在svg中。 帮忙,PLZ,解决问题! 非常感谢你提前! 我的代码:



<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script src="https://fs8.fex.net/get/044792275349/91630365/19cafc40/jquery.maphilight.js"></script>


<script type="text/javascript">
  $(function() {
    $('.map').maphilight();
    $('#squidheadlink').mouseover(function(e) {
      $('#squidhead').mouseover();
    }).mouseout(function(e) {
      $('#squidhead').mouseout();
    }).click(function(e) {
      e.preventDefault();
    });
  });
</script>
<div>
  <div class="map">
    <canvas></canvas>
    <img src="images/content/highlight/hotel_highlight2.png" width="1167px" height="580px" class="map maphilighted" usemap="#simple">
  </div>
  <map name="simple">
<area href="#" shape="poly" coords="216,145,196,178,435,65,642,144,658,111,457,24" alt="Этаж 6" data-maphilight="{"stroke":false, "fillColor":"6AA8FE","fillOpacity":0.6}" title="Этаж 6">
<area href="#" shape="poly" coords="195,195,194,227,437,134,628,196,637,161,438,87" alt="Этаж 5" data-maphilight="{"stroke":false, "fillColor":"6AA8FE","fillOpacity":0.6}" title="Этаж 5">
<area href="#" shape="poly" coords="196,244,196,280,437,203,609,249,624,215,436,159" alt="Этаж 4" data-maphilight="{"stroke":false, "fillColor":"6AA8FE","fillOpacity":0.6}" title="Этаж 4">
<area href="#" shape="poly" coords="196,295,195,331,437,273,598,304,609,266,437,228" alt="Этаж 3" data-maphilight="{"stroke":false, "fillColor":"6AA8FE","fillOpacity":0.6}" title="Этаж 3">
<area href="#" shape="poly" coords="195,345,195,366,438,322,588,345,595,322,435,294" alt="Этаж 2" data-maphilight="{"stroke":false, "fillColor":"6AA8FE","fillOpacity":0.6}" title="Этаж 2">
<area href="#" shape="poly" coords="235,403,234,449,446,438,686,450,686,396,449,375" alt="Этаж 1" data-maphilight="{"stroke":false, "fillColor":"6AA8FE","fillOpacity":0.6}" title="Этаж 1">
</map>
</div>
&#13;
&#13;
&#13;

jquery.maphilight.js here

0 个答案:

没有答案