Проблема с jquery hover и кнопкой toggle

Question

У меня есть карта, заполненная областями. Если вы наведите указатель мыши на область или щелкните ее, появится поле (div).

Когда я наводил курсор на область, появляется окно (div), но не исчезает после перемещения мыши от него. Поэтому, если бы я получил это право, это означает, что мне нужно иметь переключатель или что-то в этом роде, но для зависания. Я потратил несколько часов на поиски здесь и в других местах, пробовал некоторые коды, но никто не работал.

Так мне интересно, что это код переключаясь на .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/

Надежда Я ясно :)

Answer 1

Я не эксперт в JQuery, но она не должна быть $(this).toggleClass('display');

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

Answer 2

Вам нужно сделать что-то вроде:

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

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

}); 

Наведение принимает две функции: