JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css">
<button id="test1">With scale close</button>
<button id="test2">Without scale close</button>
<div id="dialog1" class="ui-helper-hidden">
<p>This is a test space to test the scale effect with images</p>
<img src="http://static.jquery.com/files/rocker/images/logo_jquery_215x53.gif"/>
<img src="http://static.jquery.com/files/rocker/images/logo_jquery_215x53.gif"/>
</div>
<div id="dialog2" class="ui-helper-hidden">
<p>This is a test space to test the scale effect with images</p>
<img src="http://static.jquery.com/files/rocker/images/logo_jquery_215x53.gif"/>
<img src="http://static.jquery.com/files/rocker/images/logo_jquery_215x53.gif"/>
</div>
JavaScript
$('#dialog1').dialog({
show: {effect: 'scale', duration: 200, easing: 'easeInOutExpo',callback}, ,
hide: {effect: 'scale', duration: 200, easing: 'easeInOutExpo',callback},
autoOpen: false
});
$('#dialog2').dialog({
show: {effect: 'scale', duration: 200},
//hide: {effect: 'scale', duration: 200},
autoOpen: false
});
$('#test1').click(function() { $('#dialog1').dialog('open'); });
$('#test2').click(function() { $('#dialog2').dialog('open'); });