web Toast pop 弹窗 效果 悬置2s 消失

注明：本例仅作为学习！！

要实现的 效果如下图

用到的技巧

css的position 定位 fixed 属性

设置z-index 尽量大一点

设置多少秒启动消失定时

setInterval(function(){  clearPopWindows();  }, delay); 

或者这个函数也是可以的

setTimeout(function(){$('.popupWindows').empty().remove();},2000);

具体实现：

css代码：

/**添加弹出窗口*/.popupWindows{background-color: #39434B;height: 100px;width: 120px;left: 48.9%;top: 48.9%;z-index: 9991;position: fixed;text-align:center;line-height:100px;color:white;border-radius: 24px;filter:alpha(opacity=80);      -moz-opacity:0.8;      -khtml-opacity: 0.8;      opacity: 0.8;  }

js、jq代码：

/**显示指定秒后消失**/

var lb_timer; <span style="white-space:pre"></span>function shutUpWindow(content,delay){var params = "<div class='popupWindows'>" + content + "</div>";$('#bbb').click(function(){$('body').append(params);           lb_timer = setInterval(function(){  clearPopWindows();}, delay); });}/**清除掉窗体**/function clearPopWindows() {

clearInterval(lb_timer);  lb_timer = null;  //清除$('.popupWindows').empty().remove();}$(function(){shutUpWindow("添加成功!",2000);});