.alert {
display: none;
position: fixed;
top: 50%;
left: 50%;
min-width: 300px;
max-width: 600px;
transform: translate(-50%,-50%);
z-index: 99999;
text-align: center;
padding: 15px;
border-radius: 3px;
}
.alert-success {
color: #3c763d;
background-color: #dff0d8;
border-color: #d6e9c6;
}
.alert-info {
color: #31708f;
background-color: #d9edf7;
border-color: #bce8f1;
}
.alert-warning {
color: #8a6d3b;
background-color: #fcf8e3;
border-color: #faebcc;
}
.alert-danger {
color: #a94442;
background-color: #f2dede;
border-color: #ebccd1;
}
首先,加载JQuery,然后用下面代码实现1.5秒后淡出效果:
function ShowTip(msg) {
var show = jQuery('<div>').appendTo('body').addClass('alert alert-success').html(msg).show().delay(1600).fadeOut();
setTimeout(function () {
show.remove();
}, 2000);
}