老项目page跳转增加loading效果-jquery impromptu

    上次是自己写的js来实现loading页面，这次很简单，直接使用jquery的一个插件来完成：

    可以从http://trentrichardson.com/Impromptu/index.php下载jquery-impromptu.min.js

    使用上，直接这样：

var msg = '<img src="images/loading_animation.gif"/><div align="center">Loading...</div>'

$.prompt(msg,{buttons:{}});

效果如下：

我这里用的是jquery-impromptu网上demo自带的css，如下：

/*
------------------------------
        Impromptu's
------------------------------
*/
.jqifade{
        position: absolute; 
        background-color: #aaaaaa; 
}
div.jqi{ 
        width: 400px; 
        font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; 
        position: absolute; 
        background-color: #ffffff; 
        font-size: 11px; 
        text-align: left; 
        border: solid 1px #eeeeee;
        /*
        border-radius: 10px;
        -moz-border-radius: 10px;
        -webkit-border-radius: 10px;
        */
        padding: 7px;
}
div.jqi .jqicontainer{ 
        font-weight: bold; 
}
div.jqi .jqiclose{ 
        position: absolute;
        top: 4px; right: -2px; 
        width: 18px; 
        cursor: default; 
        color: #bbbbbb; 
        font-weight: bold; 
}
div.jqi .jqimessage{ 
        padding: 10px; 
        line-height: 20px; 
        color: #444444; 
}
div.jqi .jqibuttons{ 
        text-align: right; 
        padding: 5px 0 5px 0; 
        border: solid 1px #eeeeee; 
        background-color: #f4f4f4;
}
div.jqi button{ 
        padding: 3px 10px; 
        margin: 0 10px; 
        background-color: #2F6073; 
        border: solid 1px #f4f4f4; 
        color: #ffffff; 
        font-weight: bold; 
        font-size: 12px; 
}
div.jqi button:hover{ 
        background-color: #728A8C;
}
div.jqi button.jqidefaultbutton{ 
        /*background-color: #8DC05B;*/
        /*background-color: #BF5E26;*/
        background-color: #BACCE4;
}
.jqiwarning .jqi .jqibuttons{ 
        background-color: #BF5E26;
}