AJAX提交的模态建议/提示

时间:2013-06-01 15:12:54

标签: jquery ajax jquery-ui

这不是一个代码问题,因为我希望有人可以指出我正确的方向。

我有一个提交,当前在提交页面时弹出一个动画gif(写入数据库需要几秒钟,因此我使用它来让用户知道该网站没有被冻结)。我想要的是那个动画的gif弹出一个模态,这样我就可以换一点......(我需要一个大约200px的高模态盒子,宽度为100%,盒子里面有动画gif) 。

我尝试了一些没有运气的模态脚本。 任何人都有经验或运气能够基本上自定义皮肤模态框并在其上弹出动画gif?

以下是我现在使用的代码,虽然它不是模态,但它的工作原理是当用户单击提交按钮时会弹出动画gif。但是我需要调暗背景并为前景设置皮肤,所以我认为我需要采用这种模式......

<!-- SPINNER CODE BEGIN -->

<div id="spinner" class="spinner" style="display:none;">
<img id="img-spinner" src="_assets/img/spin_lg.gif" alt="Loading"/>
</div>


<style type="text/css">
.spinner {
position: fixed;
top: 50%;
left: 50%;
margin-left: -100px; /* half width of the spinner gif */
margin-top: -100px; /* half height of the spinner gif */
text-align:center;
z-index:1234;
overflow: hidden;
width: 200px; /* width of the spinner gif */
height: 202px; /*hight of the spinner gif +2px to fix IE8 issue */
}
</style>

<script type="text/javascript">
$(document).ready(function(){
$('#proceedForm').click(function() {
    $('#spinner').show();
});
});
</script>



<!-- SPINNER CODE END -->

1 个答案:

答案 0 :(得分:1)

查看jquery blockui。它使您可以完全控制阻塞消息/窗口的外观和内容。