次のような VML マップがあります。
(使用構造例)
<div class="map" jQuery1351170963063="74">
<div class="usmap" jQuery1351170963063="75">
<group class="g vg" style="visibility: visible;" jQuery1351170258860="79" height="256px" width="434px" coordsize="21600,21600">
<shape class="vmap" id="Maryland_md" jQuery1351170258860="105"/>
<shape class="vmap" id="Delaware_de" jQuery1351170258860="104"/>
<shape class="vmap" id="Alaska_ak" jQuery1351170258860="94">
</group>
</div>
</div>
IE7 および IE8 では、シェイプ ノードにカーソルを合わせているときに mouseenter イベントが発生しないことがあります。
JS コード:
var $canvas = $(".usmap", $this);
var $canvasParent = $canvas.parent();
var mouseenterEvent = "mouseenter";
var mouseleaveEvent = "mouseleave";
$(".g", $canvas).delegate(element, mouseenterEvent + " " + mouseleaveEvent, onMouseEnterVMLShape)
.add($canvas).add($keys).add($canvasParent).mouseleave(onMouseLeaveVMLShape);