jquery仿qq右下角弹出框右下角提示消息框

发布时间:2020-05-02编辑:脚本学堂
分享一例jquery代码,仿qq右下角弹出框的特效示例,可以设置消息框的大小,弹出窗口的高度。

js代码(右下角提示框):
 

复制代码 代码示例:

<script type="text/javascript" src="script/jquery-1.3.1.min.js"></script>
<script type="text/javascript">
$.fn.extend({
show : function(weight,height,btncloseid){  //其中weight是要弹出窗口的宽度,height是要弹出窗口的高度,btncloseid是关闭窗口的id

$(this).css("width",weight+"px").css("height",height+"px");//设置消息框的大小
$(this).slidedown(2000);//弹出

$('#'+btncloseid).click(
function()
{
$(this).parent().slideup(2000);
}
);
}
});
$(document).ready(function() {
$(".tanchudiv").show('346','166','divbtnclose');
})
</script>

css代码:
 

z-index: 100; position: fixed; display: none; bottom: 0;right: 0; overflow: hidden; //弹出窗口需要设置的css样式