pokaż / ukryj okno dialogowe jQuery po najechaniu myszą

Próbuję utworzyć obszar mapy na myszy, który musi wyświetlać okno dialogowe, gdy mysz się skończy. Zawartość okna dialogowego jest inna, w zależności od obszaru.

Mój skrypt zawsze pokazuje wszystkie okna dialogowe.

Oto jsFiddle, które stworzyłem:http://jsfiddle.net/U6JGn/4/

i javascript:

$(function() {
$('#box').dialog( { modal:true, resizable:false } ).parent().find('.ui-dialog-titlebar-close').hide();

for (var i = 0; i < 2; i++) {
    $( "#elem"+i ).mouseover(function() {
        $( ".box"+i ).dialog( "open" );
    });

    $( "#elem"+i ).mouseout(function() {
        $( ".box"+i ).dialog( "close" );
    });
}
});

Co ja robię źle ?

questionAnswers(3)

yourAnswerToTheQuestion