jQuery - 将onHover处理程序添加到area元素

时间:2014-04-18 15:27:13

标签: javascript jquery area imagemap jquery-hover

如何使用jQuery选择区域元素?当区域元素悬停时,我需要在隐藏的div元素上更改CSS。我无法使用CSS来实现这一点,因为区域元素不会受到CSS的影响。

jQuery的:

(function(){
  $("#trigger1").hover(
      $("#tooltip1.tooltipContent").css("display", "block");
  );
});

html(样本):

<img alt="" style="border-width: 0px; border-style: solid;" usemap="#Map2" src="_images/timeline2.jpg" />
<map id="Map2" name="Map2">
    <area id="trigger1" href="#" coords="21,99,12" shape="circle" />
</map>

实况网页:http://www.securitybankusa.com/about-test.htm

1 个答案:

答案 0 :(得分:2)

jQuery中的hover()函数将2个函数作为参数

$("#trigger1").hover(
    function(){
        $("#tooltip1.tooltipContent").show(); // show() takes care of display block
    },
    function(){
        $("#tooltip1.tooltipContent").hide(); // hide() takes care of display none
    }
);

在您的示例中,.toggle()可能更适合

$("#trigger1").hover(
    function(){
        $("#tooltip1.tooltipContent").toggle();
    }
);

检查jQuery API页面: