-1

我有一张充满区域的地图,如果您将鼠标悬停在某个区域上或单击它,则会出现一个框(div)。

当我将鼠标悬停在一个区域上时,框(div)会出现,但在将鼠标移开后不会消失,所以如果我做对了,这意味着我需要一个切换或类似的东西,但要悬停。我花了几个小时在这里和其他地方搜索,尝试了一些代码,但没有一个有效。

所以我想知道切换 a.hover和切换的代码.click 是什么我在这里做错了什么,还是我完全使用了错误的代码?

这是我正在测试的网页:http: //iseeit.no/maptest/

这是我在 jquery 中的代码:(.no19, .no2,.no1是区域)

$(".no19").hover(function() {
$("#vest-agder").css({"display":"block"});
});

$(".no2").hover(function() {
$("#aust-agder").css({"display":"block"});
});

$(".no1").hover(function() {
$("#akershus").css({"display":"block"});
});

我尝试了类似这样的方法和其他一些方法,这似乎是正确的代码,但我无法让它正常工作:

 $(".no19").hover(function() {
     $(this).toggleClass('active');
        $('#vest-agder').toggleClass('active');
});

这是css的一个片段:

#vest-agder {
    background: #111;
    background: rgba(0,0,0,.8);
    color: #eee;
    position:absolute;
    display: none;

这是html的一个片段:

<div id="vest-agder">
    <!-- agent address in the first region -->
  <p>text</p>
  </div>

我还将 html、jquery 和 css 的所有编码都放在了 jsfiddle 中:http: //jsfiddle.net/cpKFf/1/ 我从未使用过 jsfiddle,所以我不知道如何正确设置它但我猜它需要所有图形组件才能正确显示地图。你看到的代码是这样的结果:http: //iseeit.no/maptest/

希望我说清楚了:)

4

2 回答 2

1

您需要执行以下操作:

$(".no1").hover(function() {
  $("#akershus").css({"display":"block"});
  ,

  function()  {  $("#akershus").css({"display":"none"});   }

 });

悬停有两个功能

于 2012-06-08T07:17:54.573 回答
1

我不是 jquery 方面的专家,但不应该是$(this).toggleClass('display');

http://api.jquery.com/toggleClass/

于 2012-06-08T07:06:18.387 回答