右下角提示框

这是在bootstrap上修改的需要引入bootstrap不多说直接上代码

1.HTML

<div id="pop" class="panel panel-default pop" hidden>
    <div id="popHead" class="popHead">
        <a class="popClose" title="关闭" οnclick="closePop()">关闭</a>
        <span></span>
    </div>
    <div id="popTxt" class="popContext"></div>
</div>

2.css样式

.pop{position: fixed;right:10px;bottom:10px;box-shadow: 0 5px 15px rgba(0,0,0,.5);}
.popHead{background:#fff;width:260px;border:1px solid #e0e0e0;font-size:14px;padding: 10px;}
.popClose{float: right;color: #f25656;}
.popHead span{font-size: 15px;}
.popContext{height: 80px;padding: 15px;}

3.js文件

function pop(title,text,time){

    if(title==undefined)
        title = "消息提示";

    if(text==undefined)
        text = "修改成功";

    if(time==undefined)
        time = 2000;


    $("#popHead span").html(title);
    $("#popTxt").html(text);

    $("#pop").show(100,"linear",function(){
        setTimeout("closePop()",time);
    });
}

function closePop(){
    $("#pop").hide();
}

4.引用方式

success:function(data){
    if(data.success){ 
        pop("标题","内容",提示框存在的时间(单位毫秒));
    }
}

5.说明

pop(title,text,time)该方法有三个参数，分别代表标题，内容，和提示框存在的时间！

参数默认是“消息提示”“修改成功”，2000

time单位为毫秒，time毫秒后提示框消失。