show/hide jQuery dialog box on mouseover

Question

I\'m trying to make a mouseover map area on an image that must display a dialog box when the mouse is over. The dialog box content is different, depending on which area it i

Answer 1

Try this:

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

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

UPDATE:

Take a look at the demo