注册 登录
自由的生活_软路由 返回首页

11的个人空间 https://bbs.routerclub.com/?499 [收藏] [复制] [分享] [RSS]

日志

网站右下角js弹窗广告代码(完美支持各个浏览器)

已有 1627 次阅读2013-2-22 21:00 | 浏览器, 广告

今天我在做网站时想找一个网站右下角到弹窗代码,找了好久也找不到,最后随便找了一个修改了一下。终于兼容了各个浏览器,并做到了想要到效果简单到代码如下:

<html xmlns=http://www.w3.org/1999/xhtml><head>
<meta http-equiv=Content-Type content=text/html; charset=gb2312>
<title>郑州seo原创www.8abd.com</title>
<style type=text/css>
#winpop { width:200px; position:absolute; right:0; bottom:0; border:1px solid #666; margin:0; padding:1px;

overflow:hidden; display:none;}
#winpop .title { width:100%; height:22px; line-height:20px; background:#FFCC00; font-weight:bold; text-align:center; font-

size:12px;}
#winpop .con { width:100%; height:90px; line-height:80px; font-weight:bold; font-size:12px; color:#FF0000; text-

decoration:underline; text-align:center}
#silu { font-size:12px; color:#666; position:absolute; right:0; text-align:right; text-decoration:underline; line-

height:22px;}
.close { position:absolute; right:4px; top:-1px; color:#FFF; cursor:pointer; width:35px; height:20px}
</style><script type=text/javascript>
function tips_pop(){
var MsgPop=document.getElementById(winpop);
var kg=document.getElementById(kg);
var popH=parseInt(MsgPop.style.height);//将对象的高度转化为数字
if (popH==20){//此处原来是0是我自己改成20的,因为我想让他缩下去到时候还留点最为广告。如果不想留的话改成0,把这里面所有的20全部改成0
MsgPop.style.display=block;//显示隐藏的窗口
show=setInterval(changeH(‘up’),2);
}
else {
hide=setInterval(changeH(‘down’),2);
}
}
function changeH(str) {
var MsgPop=document.getElementById(winpop);
var popH=parseInt(MsgPop.style.height);
if(str==up){
if (popH<=100){
MsgPop.style.height=(popH+4).toString()+px;
kg.style.background=#fff; //这是一个背景 点击关闭 可以设置为图片 写上关闭,如果上面设置为0的话,这一段删掉
}
else{
clearInterval(show);
}
}
if(str==down){
if (popH>=24){
MsgPop.style.height=(popH-4).toString()+px;
}
else{
clearInterval(hide);
kg.style.background=#000; //这是个背景,缩下去的背景,可以写成打开,如果上面设置0到话,这段话删掉并写成MsgPop.style.display=none
}
}
}
window.onload=function(){//加载
document.getElementById(‘winpop’).style.height=’20px’;
setTimeout(tips_pop(),0);//0秒后调用tips_pop()这个函数
}
</script></head>
<body>
<div id=silu>
<button onclick=tips_pop()>点击这个按钮弹出,可删掉此按钮</button>
</div>
<div id=winpop style=height: 20px; display: block; >
<div class=title>您有新的短消息!<span id=kg class=closeonclick=tips_pop()></div>
<div class=con>1条未读信息(</div>
</div>

</body>

</html>


路过

雷人

握手

鲜花

鸡蛋

评论 (0 个评论)

facelist doodle 涂鸦板

您需要登录后才可以评论 登录 | 注册

QQ|Archiver|手机版|小黑屋|软路由 ( 渝ICP备15001194号-1|渝公网安备 50011602500124号 )

GMT+8, 2024-6-9 00:24 , Processed in 0.098521 second(s), 5 queries , Gzip On, Redis On.

Powered by Discuz! X3.5 Licensed

© 2001-2024 Discuz! Team.

返回顶部