ハイパーリンクをクリックすると表示され、別の URL からコンテンツをフェッチするモーダル ダイアログ ボックスをページに追加しようとしています。問題は、背景ページと対話することがまだ可能であるため、モーダルにする方法を見つけることができなかったことです。私はそれを望んでいません。
ここに私が使用しているコードがあります、
HTML
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.1/themes/base/jquery-ui.css" type="text/css" />
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.1/jquery-ui.min.js"></script>
</head>
<body>
<a class="ajax" href="login.html">Open as dialog</a>
</body>
</html>
CSS
.loading {
background: url(/img/spinner.gif) center no-repeat;
}
jQuery
$(function() {
var ajaxDialog = $('<div id="ajax-dialog" style="display:hidden"></div>').appendTo('body');
ajaxDialog.dialog({
autoOpen: false
});
$('a.ajax').live('click', function() {
ajaxDialog.load(this.href);
ajaxDialog.dialog("open");
return false;
});
});
誰かがそれをモーダルにするのを手伝ってくれるならお願いします。前もって感謝します。