このリンクhttp://jqueryui.com/demos/dialog/#animatedから jquery ui を使用して、MVC4 アプリケーションで動作しないダイアログに使用しました
これは私のビューです @{ ViewBag.Title = "Dialog";
}
<link href="../../Content/themes/base/jquery.ui.all.css" rel="stylesheet" type="text/css" />
<link href="../../Content/themes/base/jquery.ui.dialog.css" rel="stylesheet" type="text/css" />
<script src="../../Scripts/jquery-ui-1.8.11.js" type="text/javascript"></script>
<script src="../../Scripts/jquery-ui-1.8.11.min.js" type="text/javascript"></script>
<script type="text/javascript">
// increase the default animation speed to exaggerate the effect
$.fx.speeds._default = 1000;
$(function () {
$("#dialog").dialog({
autoOpen: false,
show: "blind",
hide: "explode"
});
$("#opener").click(function () {
$("#dialog").dialog("open");
return false;
});
});
</script>
<div class="demo">
<div id="dialog" title="Basic dialog">
<p>
This is an animated dialog which is useful for displaying information. The dialog
window can be moved, resized and closed with the 'x' icon.</p>
</div>
<button id="opener">Open Dialog</button>
</div>
<!-- End demo -->
<div class="demo-description">
<p>
Dialogs may be animated by specifying an effect for the show and/or hide properties.
You must include the individual effects file for any effects you would like to use.</p>
</div>
<!-- End demo-description -->
<div class="demo-description">
<p>
A modal dialog prevents the user from interacting with the rest of the page until
it is closed.</p>
</div>
<!-- End demo-description -->