仿163邮件提示

来源：易贤网阅读：896 次日期：2014-08-13 16:07:12

温馨提示：易贤网小编为您整理了“仿163邮件提示”,方便广大网友查阅！

查看效果：仿163邮件提示

代码如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<head>

<title>仿163邮件提示-网站制作学习网</title>

</head>

var d_h = 120;//定义显示窗口高度

var d_w = 170;//定义显示窗口宽度

var delay_t = 3;//设子默认的隐藏时间

var k;//定义框架对象

var show_o;//定义时间对象

var hide_o;//定义时间对象

$(function(){

var msg = "网站制作学习网提醒你:你有新信息";//定义显示内容

$("#foraspcn").html(msg+"<br><br><a href='#' onclick='delay_();'>我知道了<a></div>");

$("#foraspcn").css({"top":$(window).height()-15,"left":$(window).width()-d_w-20,"width":d_w,"height":1,"z-index":999,"border":'solid #000 1px',"position":'absolute',"overflow":'hidden',"text-align":'center',"padding-top":10}).show();//这里的15 和20减量是为了做偏移，不同的浏览器下的偏移

show_o = setInterval(s_k,20);//

});

function s_k(){//定义显示窗口函数

var obj =$("#foraspcn");

var height_ =parseInt(obj.css("height"));

var top_ =parseInt(obj.offset().top)

$("#te").html(height_);

obj.css("height",height_+1).css("top",top_-1);

if(height_>=d_h){clearInterval(show_o);setTimeout(delay_,delay_t*1000);}

}

function delay_(){clearInterval(show_o);hide_o=setInterval(h_k,20);}

function h_k(){//定义隐藏窗口函数

var obj =$("#foraspcn");

var height_ =parseInt(obj.css("height"));

var top_ =parseInt(obj.offset().top)

obj.css("height",height_-1).css("top",top_+1);

if(height_<=0){clearInterval(hide_o);obj.hide();}

}

</script>

<body>

这做了一个仿163有新邮件提醒，在右下角显示提示窗口。<br>

如果改为触发的提醒，则将$(function(){});改改为一个函数，调用函数即可<br>

网站制作学习网原创转载请注明http://www.forasp.cn

</body>

</html>

更多信息请查看IT技术专栏

上一篇：jquery动态添加文本框

下一篇：jQuery之ajax事件处理

易贤网手机网站地址：仿163邮件提示

由于各方面情况的不断调整与变化，易贤网提供的所有考试信息和咨询回复仅供参考，敬请考生以权威部门公布的正式信息和咨询为准！