<div id="toastDiv" class="toast">
<span id="tipMsg"></span>
</div>
Front-end page html, just find a place to put it, and then use css to move it to the middle of the screen
.toast{
position: fixed;
height: 100px;
width: 200px;
top:50%;
left:50%;
margin:-50px 0 0 -100px;
background-color: #c0c0c0;
z-index=10;
border-radius:10px 10px;
text-align: center;
padding: 20px;
display: none;
}
Front-end css, the position is moved to the middle of the screen, not displayed
function toastShow(msg,time){
var toast=$('#toastDiv');
var tipMsg=$('#tipMsg');
tipMsg.text(msg);
toast.fadeIn();
setTimeout(function(){
toast.fadeOut();
}, time);
}
js code, use jquery's 'fadeIn()', 'fadeOut()' methods to fade in and check out, and use 'setTimeout()' to make toast disappear regularly.
Method call (two parameters, the first is the information to be displayed, the second is the display time, the unit is milliseconds, where 1000 means 1 second):
toastShow(data.msg, 1000);
Show results
