Close jQuery UI dialog non-modal v1
Close the jquery UI dialog by clicking off the dialog.
by jasonday
HTML
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/start/jquery-ui.css">
<div id="dialog">Your non-modal dialog</div>
<a href="#" id="open">Open dialog</a>
JavaScript
$('#open').click(function() {
$('#dialog').dialog('open');
});
$('#dialog').dialog({
autoOpen: false,
modal: false
});
// Close Pop-in If the user clicks anywhere else on the page
jQuery('html') //set for html for jsfiddle, but should be 'body'
.bind(
'click',
function(e){
if(
jQuery('#dialog').dialog('isOpen')
&& !jQuery(e.target).is('.ui-dialog, a')
&& !jQuery(e.target).closest('.ui-dialog').length
){
jQuery('#dialog').dialog('close');
}
}
);